vue项目中观看数据出现被调用两次怎么解决

  

vue项目中观看数据出现被调用两次怎么解决?针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。

<强>背景:

路由结构/视频/1. mp4,即/视频是父路,由1./mp4是/视频的动态子路由,在/视频父路由中会通过url的params获取视频信息,即通过/1。mp4获取对应的视频完整信息,然后通过道具传到动态子路由中,然后子路由通过接受到的视频对象,进行展示

<强>问题:

当路由切换时,即当我点击其他视频时,导致动态子路由变化时,我监听了/视频父路由的变化并重新根据url的params获取视频对象,并自动通过道具传入子路由中,我在子路由中通过看视频对象来进行一些操作,结果

看:{
  视频(){
  console.log (“test")
  }
  }

测试被打印了两次,通过一番查找,才发现,当子路由切换时,父路由/视频中数据的数据都会被初始化为默认值,所以导致视频对象变化了两次,一次是因为初始化被重置为默认值空对象,一次是请求后的正确数据

<强>结局:

将视频对象存到vuex中,然后父路由将vuex中视频的对象传给子路由就行了

<强> vue看一个对象或数组时,newvalue和oldvalue一样

在官方的代码改写了一下,当深度看一个对象时,newval和oldval的值为什么是相等的呢?

 var vm=new Vue ({
  数据:{
  答:1,
  c: {
  c1:1,
  c2:2
  }
  },
  看:{
  & # 39;一个# 39;:函数(val oldVal) {
  控制台。日志(val, oldVal (val==oldVal))
  },//方法名
  & # 39;b # 39;: & # 39; someMethod& # 39;//深度观察者
  & # 39;c # 39;: {
  处理程序:函数(val, oldVal) {
  控制台。日志(val, oldVal (val==oldVal))
  },
  深:真
  }
  }
  })
  
  vm。一个=2
  vm.c。c1=2 

和深度无关,而是在修改(不是替换)对象或数组时,旧值将与新值相同,因为它们索引同一个对象/数组.Vue不会保留修改之前值的副本。

关于vue项目中观看数据出现被调用两次怎么解决问题的解答就分享到这里了,希望以上内容可以对大家有一定的帮助,如果你还有很多疑惑没有解开,可以关注行业资讯频道了解更多相关知识。

vue项目中观看数据出现被调用两次怎么解决