众所周知,vue中computed为计算属性,计算属性是一种带有行为的属性,本质上是方法,但是不能调用。
而需要重新渲染时使用methods中的方法会重复调用执行函数,若函数复杂,浏览器性能会降低。使用computed则会缓存计算结果,避免重复计算,从而提高效率。
computed中的get方法可简单理解为取值时调用此方法,而set则为重新赋值时调用。
当不设置get和set方法时可简写,如:
computed: {
//调用时只使用结果
remaningCount() {
return this.todos.filter(t => !t.completed).length
}
}
而当计算属性中设置get方法和set方法时,应以对象的方式加入,否则会解析不了get和set方法:
computed: {
remaningCount() {
return this.todos.filter(t => !t.completed).length
},
toggleAllStat: {
get: function () {
return this.todos.every(t => t.completed)
},
set:function () {
console.log(111);
}
}
}