watch和computed的区别
watch和computed都是对数据的监听只有数据发生变化时才会触发,但是他们擅长的领域不一样
watch更擅长一对多:就是主要监听一个可以影响多个数据的数据
computed擅长多对一:主要监听多个数据影响一个数据的数据,一定要return
组合出的那个数据会自动定义不用在data中再次定义,
当然也可以使用watch来监听组成computed所监听数据的每一个数据,但是这样代码的重复率过高
### watch
var vm = new Vue({
el: '#demo',
data: {
firstName: 'Foo',
lastName: 'Bar',
},
watch: {
firstName: function (val) {
this.fullName = val + ' ' + this.lastName
},
lastName: function (val) {
this.fullName = this.firstName + ' ' + val
}
}
})
### computed
var vm = new Vue({
el: '#demo',
data: {
firstName: 'Foo',
lastName: 'Bar'
},
computed: {
fullName: function () {
return this.firstName + ' ' + this.lastName
}
}
})
methods和watch、computed的区别
这个很直观,methods是通过事件驱动来执行函数的是被动的
watch、computed是当监听的数据发生变化时主动执行这个函数
methods和computed的区别
区别一个是主动与被动,另一个是methods的运算是没有缓存的,computed运算是有缓存的(只要运算所依赖的数据没有发生变化就会从缓存中取出结果)