uni-app watch事件监听(普通监听,监听对象)
1、普通监听(无法监听到第一次绑定的变化)
<input type="text" v-model="userName"/> //监听 当userName值发生变化时触发 watch: { userName (newName, oldName) { console.log(newName) } }
2、普通监听(可监听到第一次绑定的变化)
第一种方式有一个缺点 就是当值第一次绑定的时候 不会执行监听函数,,只有当值改变的时候 才会执行,如果想在第一次绑定的时候执行此监听函数,则需要设置 immediate为true,代码如下:
<input type="text" v-model="userName"/> watch: { userName: { handler (newName, oldName) { console.log(newName) }, immediate: true } }
3、深度监听(可监听对象内属性变化)
<input type="text" v-model="cityName.name" /> data (){ return { cityName: {name:'北京'} } }, watch: { cityName: { handler(newName, oldName) { console.log(newName) }, immediate: true, deep: true } }