計算的 setter
只要計算所依賴的任何資料發生變化,計算屬性就會自動重新計算。但是,如果需要手動更改計算屬性,Vue 允許你建立一個 setter 方法來執行此操作:
模板 (來自上面的基本示例):
<div id="example">
a={{ a }}, b={{ b }}
</div>
使用 Javascript:
var vm = new Vue({
el: '#example',
data: {
a: 1
},
computed: {
b: {
// getter
get: function () {
return this.a + 1
},
// setter
set: function (newValue) {
this.a = newValue - 1
}
}
}
你現在可以呼叫 getter 或 setter:
console.log(vm.b) // -> 2
vm.b = 4 // (setter)
console.log(vm.b) // -> 4
console.log(vm.a) // -> 3
vm.b = 4
將呼叫 setter,並將 this.a 設定為 3; 通過擴充套件,vm.b 將評估為 4。