模板中如果有大量的逻辑代码，这时候推荐使用计算属性，例如：
你可以直接在模板中直接这样写 {{ message.split('').reverse().join('') }}，但是这样的话逻辑比较复杂。不太好。当然，我们发现也可以用method的完成。我们只要触发一下这个方法，这个方法就会执行一遍，无论，你有没有改变这个数据，这就是所说的没有缓存。 这里最好的方法就是用computed，computed跟method的最大的区别就是缓存问题。执行computed的里面的方法的时候，如果对应的值（这个例子中的message）没有发生改变，它会直接将缓存中的值拿出来给你，而不是像method再执行一遍方法，然后算出结果传出来。
<p>Original message: "{{ message }}"</p>
<p>Computed reversed message: "{{ reversedMessage }}"</p>
var vm =newVue({
el:'#example',
data: {
message:'Hello'
},
computed: {
reversedMessage:function(){
returnthis.message.split('').reverse().join('')
}
}
})
因为之前自己不太懂，所以写下来，想分享的可是我写的我自己都觉得乱 ，估计你们也看不懂，算了，随他去吧！！！哈哈
网友评论