vue中watch的监听使用

<template>
	<div>
		<div @click="clickHander">按钮点击</div>
	</div>
</template>
<script>
export default {
	watch:{
		name(val.oldval){
		},
		userinfo:{
			handler(val,oldval){
				console.log(val,oldval)
			},
			deep: true, //深层监听
			immediate: true //最初绑定的时候就执行
		},
		userName(){
			console.log('监听computed')
		}
	},
	computed:{
		userName(){
			return this.age;
		}
	},
	data(){
		return {
			userinfo: {name: 'jack'},
            age:14,
            arr:[1,2,3,4,5]
		}
	},
	methods:{
		zx(){
			this.age = 15;
			this.userinfo.name = 'mike'
			//数组的监听
			this.arr.push(7) //可以监听到
			this.arr[2] = 'zzz' //无法监听改变数组的下标和length的改变 
			this.$set(this.arr,2,'xxx') //可以用set监听
			this.arr.splice(2,1,'xxx') //使用splice可以被监听
		}
	}
}
</script>
watch 可以侦听 data、props、computed、$route