<!-- 计计算属性 computed-->
<div id="app14">
{{ message }}
{{ newMessage1 }}
{{ newMessage() }}
</div>
调用:
StudyComputed("#app14")
实现:
//computed vs methods
//我们可以使用 methods 来替代 computed,
//效果上两个都是一样的,但是 computed 是基于它的依赖缓存,
//只有相关依赖发生改变时才会重新取值。而使用 methods ,在重新渲染的时候,函数总会重新调用执行。
function StudyComputed(obj) {
new Vue({
el: obj,
data: {
message:'zzzz'
},
computed: { //可以说使用 computed 性能会更好,但是如果你不希望缓存,你可以使用 methods 属性。
newMessage1: function () {
return this.message+'hao'
}
},
methods: {
newMessage: function () {
return this.message + 'hao'
}
}
})
}