首页 > 技术连载 > 正文

「Vue.js开发连载十四」观察者

来源:卓象IT实训基地【原创】 时间:2018-11-09

上一篇文章讲解“计算属性”,本篇文章讲解“观察者”。


监听指定字段,当字段值发生变化时触发的函数。

1. 监听字段

「Vue.js开发连载十四」观察者


【例】监听message变量,当其变化时,在控制台输出message的新旧值。

「Vue.js开发连载十四」观察者


浏览器访问:

「Vue.js开发连载十四」观察者



2. 监听对象

deep:当我们观察的字段对应的值是一个对象时候,如果我们只是改变对象的某这字段的值,就需要制定deep: true。

「Vue.js开发连载十四」观察者


【例】监听对象中的数值变化。

「Vue.js开发连载十四」观察者


浏览器访问:

「Vue.js开发连载十四」观察者


注意

1. 默认watch只有在观察的数值发生变化的时候才触发回调,如果想要初始化时执行,那么指定immediate: true,这样就和计算属性一样,在初始化阶段就触发。

Vue.js连载为卓象程序员原创,转载请联系卓象程序员

「Vue.js开发连载十四」观察者


关注卓象程序员,定期发布技术文章

下一篇讲解“vue.js生命周期”

「Vue.js开发连载十四」观察者

上一篇: 「Vue.js开发连载十三」计算属性
下一篇: 「Vue.js开发连载十五」生命周期