关于计算属性的使用
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中，则只要每次进行重绘，都会触发这个计算，这样是会很耗性能的，但如果将这个计算放在计算属性中，只要这个值不发生变化，那就不会重新计算，返回的还是这个值，这样也可以节省性能。
