重庆分公司,新征程启航
为企业提供网站建设、域名注册、服务器等服务
这篇文章主要介绍“Vue.js中的$watch方法有什么用”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“Vue.js中的$watch方法有什么用”文章能帮助大家解决问题。
创新互联专注于企业营销型网站建设、网站重做改版、宝山网站定制设计、自适应品牌网站建设、html5、商城网站建设、集团公司官网建设、外贸网站建设、高端网站制作、响应式网页设计等建站业务,价格优惠性价比高,为宝山等各大城市提供网站开发制作服务。
代码如下:
// 键路径 vm.$watch('a.b.c', function (newVal, oldVal) { // 做点什么 }) // 函数 vm.$watch( function () { return this.a + this.b }, function (newVal, oldVal) { // 做点什么 } )
vm.$watch 返回一个取消观察函数,用来停止触发回调:
var unwatch = vm.$watch('a', cb) // 之后取消观察 unwatch()
博主很认真地看了看,当时就懵逼了,没看懂。还好网上大神多,查了查终于搞明白这个$watch方法的用法了。说白了$watch这货就是观察一个值的变化,观察的这个值一变化的话,那么就执行function里面的语句。废话不多说,咱们直接看代码:
HTML:
firstName:
lastName:fullName: {{fullName}}
JS:
var vm = new Vue({ el: '#watch', data: { firstName: 'a', lastName: 'fei', fullName: 'a fei' }, watch: { firstName: function (val) { this.fullName = val + ' ' + this.lastName }, lastName: function (val) { this.fullName = this.firstName + ' ' + val } } })
关于“Vue.js中的$watch方法有什么用”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识,可以关注创新互联行业资讯频道,小编每天都会为大家更新不同的知识点。