4，计算属性与侦听器

计算属性computed

计算属性一般就是用来通过其他的数据算出一个新数据

getter/setter

优点：

缓存。基于它们的响应依赖关系缓存, 计算属性只会在相关响应式依赖发生改变时重新求值

<p>{{ calculateBooksMessage() }}</p>

methods: {
  calculateBooksMessage() {
    return this.author.books.length > 0 ? 'Yes' : 'No'
  }
}

这就意味着只要 author.books 还没有发生改变，多次访问 publishedBookMessage 时计算属性会立即返回之前的计算结果，而不必再次执行函数。

侦听器/侦听属性

watch

当需要在数据变化时执行异步或开销较大的操作时