vue学习笔记（三）计算属性与事件监听v-on

一、什么是计算属性

我们知道，在模板中可以直接通过插值语法显示一些data中的数据。但是在某些情况，我们可能需要对数据进行一些转化后再显示，或者需要将多个数据结合起来进行显示比如我们有firstName和lastName两个变量，我们需要显示完整的名称。但是如果多个地方都需要显示完整的名称，我们就需要写多个{ {firstName}} { {lastName}}
我们可以将上面的代码换成计算属性
计算属性是写在实例的computed选项中的

二、计算属性的setter和getter

每个计算属性都包含一个getter和一个setter。在上面的例子中，我们只是使用getter来读取。在某些情况下，你也可以提供一个setter方法（不常用）。在需要写setter的时候，代码如下：

 fullName: {
        set: function(newValue) {
          // console.log('-----', newValue);
          const names = newValue.split(' ');
          this.firstName = names[0];
          this.las