计算属性
为什么需要计算属性
把复杂的计算逻辑用简洁的模板内容体现出来。
计算属性的用法
computed: { reverseString: function(){ return this.msg.split(‘‘).reverse().join(‘‘); } }
弄好了直接在页面中引用计算属性的方法名
<div>{{reverseString}}</div>
对比原方法
<div>{{msg.split(‘‘).reverse().join(‘‘)}}</div>
最后得到的结果是一样的
计算属性与方法的区别
缓存 在计算属性中添加一个日志 我们将该计算属性运行两遍
methods: { reverseMessage: function(){ console.log(‘methods‘) return this.msg.split(‘‘).reverse().join(‘‘); } }
查看控制台发现只有一次打印结果。说明，当第一次运行时，我们缓存了她的结果，第二次运行时就可以直接调用，这样可以提高性能。
而方法不存在缓存，调用多少遍方法就会执行多少遍。
原文：https://www.cnblogs.com/limu-zy/p/14130653.html