php网站打开一片空白,河南企业网站建设,网络推广优化招聘,嘉兴网页制作公司vue 的 watch 除了可以使用声明式的配置项以外#xff0c;还可以通过命令式 this.$watch 方法。 如下是我们比较少用的命令式#xff08;想要初始只监听一次#xff0c;必须命令式写法#xff09;#xff1a;
监听只运行一次 声明式
export default{data: {showType: fa…vue 的 watch 除了可以使用声明式的配置项以外还可以通过命令式 this.$watch 方法。 如下是我们比较少用的命令式想要初始只监听一次必须命令式写法
监听只运行一次 声明式
export default{data: {showType: false},watch: {showType(newValue, oldValue) {console.log(newValue)}}
}命令式 监听一次 必须是命令写法 命令式好处是可以得到一个取消监听的函数在需要时取消监听比如你想要只监听一次可以像下面使用
export default {data: {showType: false},mounted() {this.$watch(showType, function(newValue, oldValue){console.log(newValue);});},
}深度监听 监听对象重某一个属性
data() {return {numbers: {a: 1,b: 1}}}watch: {numbers.a: {handler(newValue, oldValue) {console.log(newValue, oldValue)console.log(numbers正在被侦听)},deep: true, // 是否深度监听immediate: true // 页面加载立即执行}
-------------------------------另一种写法-----------------------------dict.a(newValue, oldValue){console.log(newValue, oldValue)console.log(numbers正在被侦听)},
}**监听对象中的每一个属性**
data() {return {numbers: {a: 1,b: 1}}
},watch: { numbers: { handler(newValue, oldValue) { console.log(newValue, oldValue) console.log(‘numbers正在被侦听’) }, deep: true immediate: true }, } created() { setTimeout(() { this.numbers.a 5 this.numbers.b 50 }, 2000) }