通过上一章的介绍,我们己经可以搭建出一个简单的 Vue 应用,在模板中双向绑定 些数据 或表达式了。但是表达式如果过长,或逻辑更为复杂时,就会变得雕肿甚至难以阅读和维护,比如: <div> {{ text.split ( ’,’ ).reverse().join (’,’)}} </div>
computed
computed 类型: Object 所属对象: ComponentOptions 参考: https://cn.vuejs.org/v2/api/#computed 计算属性将被混入到 Vue 实例中。所有 getter 和 setter 的 this 上下文自动地绑定为 Vue 实例。 示例: var vm = new Vue({ data: { a: 1 }, computed: { // 仅读取 aDouble: function () { return this.a * 2 }, // 读取和设置 aPlus: { get: function () { return this.a + 1 }, set: function (v) { this.a = v - 1 } } } }) vm.aPlus // => 2 vm.aPlus = 3 vm.a // => 2 vm.aDouble // => 4