深度监听啊

当需要监听一个对象的改变时,普通的watch方法无法监听到对象内部属性的改变,此时需要deep属性对对象进行深度监听

data () {
   		return {
		 form: {id: 1, name: 'milky'}
	}
  },
  watch: {
    form: {
      handler(newVal, oldVal) {
      // ...
    },
    deep: true,
    immediate: true
    }

immediate表示在watch中首次绑定的时候,是否执行handler,值为true则表示在watch中声明的时候,就立即执行handler方法,值为false,则和一般使用watch一样,在数据发生变化的时候才执行handler。

如果只需要监听对象中的一个属性值, 可以使用字符串的形式监听对象属性:

data () {
   		return {
		 form: {
		 	name: 'milky',
			age: 18
		}
	}
  },
  watch: {
    "form.name": {
      handler(newVal, oldVal) {
      // ...
    },
    deep: true,
    immediate: true
    }

你可能感兴趣的:(笔记,javascript,vue,深度监听,deep)