當前位置:編程學習大全網 - 源碼下載 - vue中watch監聽值或者form對象以及路由的變化

vue中watch監聽值或者form對象以及路由的變化

var vm=new Vue({

data:{

a:1,

b:{

c:1 }

},

watch:{

a(val, oldVal){//普通的watch監聽 console.log("a: "+val, oldVal);

},

b:{//深度監聽,可監聽到對象、數組的變化 handler(val, oldVal){

console.log("b.c: "+val.c, oldVal.c);//但是這兩個值打印出來卻都是壹樣的 },

deep:true }

}

})

vm.a=2

vm.b.c=2

a是壹個普通的值,當a的值變化時會被監聽到,b是壹個對象,不能直接像a那麽寫,需要深度監聽才能捕捉到,但是當我想去捕捉b對象中某壹個值的變化時卻發現,打印出來的兩個值是不壹樣的

這樣就只能知道對象發生變化卻不知道具體哪個值發生了變化,如果想監聽對象某壹個值得變化可以利用計算屬性computed

var vm=new Vue({

data:{

b:{

c:1 }

},

watch:{

newValue(val, oldVal){

console.log("b.c: "+val, oldVal);

}

},

computed: {

newValue() {

return this.b.c

}

}

})

vm.b.c=2

用watch去監聽computed計算過的值就可以直接知道是哪個對應的值發生了變化

watch: { // 監聽路由傳值變化,當頁面不重新加載的時候需要加載不同模型

$route () {

? this.sceneName = this.$route.query.sceneName

? window.TTS.addObjectToScene(this.sceneName)

}

? }

  • 上一篇:520表白情話可復制2017
  • 下一篇:南寧app開發的公司,效率高的
  • copyright 2024編程學習大全網