计算属性有缓存,不刷新页面的情况下数据不会发生改变;
方法没有缓存,不刷新页面的情况下数据也会发生改变。
var hello = new Vue({
el : "#hello",
data : {
message : "hello"
},
methods : {
reverseMessageMethod : function(){
return this.message.split("").reverse().join("") + Date.now();
}
},
computed : {
reverseMessage : function(){
return this.message.split("").reverse().join("") + Date.now();
}
}
});
<div>计算属性-缓存:{{reverseMessage}}</div>
<div>方法:{{reverseMessageMethod()}}</div>
计算属性和方法的结果返回时,都有添加时间戳,所以可以通过console进行操作查看两者的区别:
方法-hello.reverseMessageMethod();
计算属性-hello.reverseMessage;