關于計算屬性的使用
vue中模板中使用表達式是很方便的一種方式，如:
<div id="example">
{{ message.split('').reverse().join('') }}
</div>
但是如何將太多的邏輯放入模板中處理，就會使得模板很臃腫，這樣不利于代碼的維護。使用計算屬性很方便的解決了這個問題，不至于使得模板很臃腫復雜。
<div id="example">
{{ message}}
</div>
var vm = new Vue({
el: '#example',
data: {
message: 'Hello'
},
computed: {
// a computed getter
reversedMessage: function () {
// `this` points to the vm instance
return this.message.split('').reverse().join('')
}
}
})
其實同樣功能在methods中也能實現，
methods: {
reversedMessage: function () {
return this.message.split('').reverse().join('')
}
}
不過在計算屬性中實現的好處是可以緩存，比如說在計算屬性中計算一個值需要進行大量的操作，如果將這個計算放在methods中，則只要每次進行重繪，都會觸發這個計算，這樣是會很耗性能的，但如果將這個計算放在計算屬性中，只要這個值不發生變化，那就不會重新計算，返回的還是這個值，這樣也可以節省性能。
