一. 計算屬性
<p> {{ message.split(' ') . reverse( ) . join(' ') }} </p>
對于任何復(fù)雜邏輯,我們都應(yīng)該使用計算屬性
在瀏覽器的控制臺中改變vm.message的值,相應(yīng)的vm.reversedMessage的返回值就會改變
你可以像綁定普通屬性一樣在模板中綁定計算屬性。Vue 知道vm.reversedMessage依賴于vm.message搓扯，因此當vm.message發(fā)生改變時检痰，所有依賴于vm.reversedMessage的綁定也會更新。而且最妙的是我們已經(jīng)以聲明的方式創(chuàng)建了這種依賴關(guān)系：計算屬性的 getter 函數(shù)是沒有連帶影響 (side effect)锨推，這使得它易于測試和推理铅歼。
二. 計算屬性的緩存VS方法
我們也可以在表達式中調(diào)用方法來達到同樣的效果
重點:? 我們可以將同一函數(shù)定義為一個方法而不是一個計算屬性。對于最終的結(jié)果换可，兩種方式確實是相同的椎椰。然而，不同的是計算屬性是基于它們的依賴進行緩存的沾鳄。計算屬性只有在它的相關(guān)依賴發(fā)生改變時才會重新求值慨飘。這就意味著只要message還沒有發(fā)生改變，多次訪問reversedMessage計算屬性會立即返回之前的計算結(jié)果译荞，而不必再次執(zhí)行函數(shù)瓤的。
三. ?計算屬性 VS 被觀察的屬性
Vue 確實提供了一種更通用的方式來觀察和響應(yīng) Vue 實例上的數(shù)據(jù)變動：watch 屬性慎皱。當你有一些數(shù)據(jù)需要隨著其它數(shù)據(jù)變動而變動時，你很容易濫用watch——特別是如果你之前使用過 AngularJS叶骨。然而茫多，通常更好的想法是使用計算屬性而不是命令式的watch回調(diào)。細想一下這個例子：
四. 計算屬性的setter
計算屬性中默認只有g(shù)etter方法,不過需要時也可以添加setter方法
五. 觀察者
雖然計算屬性在大多數(shù)情況下更合適忽刽，但有時也需要一個自定義的 watcher天揖。這是為什么 Vue 通過watch選項提供一個更通用的方法，來響應(yīng)數(shù)據(jù)的變化跪帝。當你想要在數(shù)據(jù)變化響應(yīng)時今膊，執(zhí)行異步操作或開銷較大的操作，這是很有用的伞剑。
在這個示例中斑唬，使用watch選項允許我們執(zhí)行異步操作 (訪問一個 API)，限制我們執(zhí)行該操作的頻率黎泣，并在我們得到最終結(jié)果前恕刘，設(shè)置中間狀態(tài)。這是計算屬性無法做到的抒倚。
除了watch選項之外褐着，您還可以使用vm.$watch API命令。
