关于watch的用法（vue）

关于vue项目中使用监听函数watch的几种方式

<template>
	<div>
		<input v-model="watchValue" />
		<input v-model="watchObj.air" />
		<input v-model="watchObj.dark.moon" />
	</div>
</template>
export default {
	data () {
		return {
			watchValue: '',
			watchObj: {
				air: '',
				dark: {
					moon: ''
				}
			}
		}
	},
	watch: {
		watchValue(newVal, oldVal) {
			console.log(newVal, oldVal)
		},
		watchObj: {
			handler(newVal){
				console.log(newVal)
			}
			deep: true, // 为了发现对象内部值的变化，深度监听
			immediate: true // 立即以表达式的当前值触发回调，先执行一次
		},
		'watchObj.dark.moon': function (newVal, oldVal) {
			console.log(newVal, oldVal)
		}
	}
}