vue的computed计算属性

在模板中放入太多的逻辑会让模板过重且难以维护，所以，对于复杂逻辑，vue 提倡使用计算属性。

computed和methods

computed和methods二者可以进行完全替换

<p>reversed message:{hellomylove()}<p>
<p>reversed message:{hellomylove}<p>

<script>
computed:{
	hellomylove(){
		return this.message.split('').reverse().join('')
	}
}
methods:{
	hellomylove:function{
		return this.message.split('').reverse().join('')
	}
}
</script>

计算属性是基于它们的响应式依赖进行缓存的。也就是在执行前一次计算属性的结果之后，结果会被保存起来，当需要访问这个结果的时候不必再次执行函数直接调用结果，直到下一次计算属性发生变化后才会开始实行方法。如下的计算属性就会不断更新更新。

<p>time :{{now()}}</p>

computed:{
	now:function(){
	now:Date.noe()
  }
}

**计算属性通常用作复杂的、大量的计算。因此计算属性缓存可以减少计算。**如果你不希望有缓存，用methods来替代。

computed和watch

当你有一些数据需要随着其它数据变动而变动时，你很容易滥用 watch，然而，通常更好的做法是使用计算属性而不是命令式的 watch 回调。
当需要在数据变化时执行异步或开销较大的操作时， watch 方式是最有用的。其允许我们执行异步操作 (访问一个 API)，限制我们执行该操作的频率，并在我们得到最终结果前，设置中间状态。这些都是计算属性无法做到的。