## 侦听器 能用计算属性就用计算属性. ``` <div id="app"> {{ fullName }} </div> <script> var vm = new Vue({ el: '#app', data: { firstName: 'li', lastName: 'zhenjie', fullName: '', }, //侦听器,fullName的变化取决于firstName和lastName,如果这两个值不发生变化,fullName是不会发生变化的,侦听器也有缓存 watch: { firstName: function () { this.fullName = this.firstName + ' ' + this.lastName; }, lastName: function () { this.fullname = this.firstName + ' ' + this.lastName; }, }, }) </script> ``` ## 还有一种实现方式 ``` <div id="app"> {{ fullName() }} </div> <script> var vm = new Vue({ el: '#app', data: { firstName: 'li', lastName: 'zhenjie', }, methods:{ fullName:function () { return this.firstName + this.lastName; } } }) </script> ```