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