computed
- 不在data中定义
- 场景:适用于多个变量计算一个变量。比如商品总价,用单价*数量。只要单价或数量发生了变化,总价就会被修改。
- 优点:只有在依赖(即里面的变量)发生变化的时候才会重新计算,否则使用缓存中的数据,大大提高了性能。
computed: {
totalPrice: {
get() {
let _totalPrice = 0;
.... // 这个值的计算方式
return _totalPrice;
},
set(newVal) {
// 只有值被更新的时候才会触发。如果监听的是对象,要对象被重新赋值才会触发。
// 比如totalPrice.count=5 这样是不会被触发的
// totalPrice= {...} 才可以
}
}
}
watch
- 在data中定义
- 适用场景:一个数据引起多个数据变化。比如路由、输入框的值等等。
watch() {
$route(to, from) {
console.log(to);
console.log(from);
}
}