vue的computed、watch

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);
	}
}