计算的 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。