vue之watch

vue之watch中handler的使用

实际开发中碰到的问题， 老规矩，废话不多说，上代码
1：watch ====> deep;

 data() {
    return {
		arr: [
				{
					num:'',
					id: ''
					...
				}
			]
		}
    },
 watch: { 
	arr: {
		handler(newVal, oldVal) {
			.......
		},
		deep: true // 数据深度监听	
	 }
	}
	// 注：deep属性是深度监听；类似于上面的arr；如果不深度监听便监听不到arr中num的变化

2：watch ====> immediate

 data() {
    return {
		arr: [
				{
					num:'',
					id: ''
					...
				}
			]
		}
    },
 watch: { 
	arr: {
		handler(newVal, oldVal) {
			.......
		},
		immediate: true // 初始化时；是否执行handler函数
	 }
	}
	// 注：immediate属性是初始化的时候是否执行一次handler；因为watch是类似于惰性的；因此初始化的时候是不会执行的；因此设置immediate为true 的时候才会触发执行；

watch其他写法

 data() {
    return {
		obj: {
				num: 2
			}	
		}
    },
 watch: { 
	'obj.num': {
		handler(newVal, oldVal) {
			.......
		},
		immediate: true
	 },
	 // 还可以这样写
	 obj(newVal, oldVal){
		.......
     }
	 
	},