鱼塘码农

菜鸟学习记录
鱼海无涯

Vue的watch监听事件

Vue的watch监听事件,用来监听变量是否发生变化,初次使用时不知道为什么一直监听不到item的变化,第一次写法:

watch: {
  item(item) {
      console.log('item', item);
  }
},

这个写法一直监听不到item的变化,经过查询才知道,这种方法不会监听变量第一次绑定值,只有再次变化时才能监听到。经过一番百度,才知道下面的写法:

watch: {
  item: {
    handler() { // 固定写法
      console.log('item', item);
    },
    immediate: true, //immediate为true才会监听第一次绑定
  },
},

顺带着看了第三种写法:深度监听,当要监听对象或数组的时候需要添加deep:true属性

watch: {
  item: {       //此处item为一个对象,当他的属性发生变化时
    handler() { // 固定写法
      console.log('item', item);
    },
    immediate: true, //immediate为true才会监听第一次绑定
    deep: true       //监听属性的变化
  },
},
文章内容可能来自网络,纯为学习使用,若有侵权,请联系我删除 | 当前页面:鱼塘码农 » Vue的watch监听事件

评论