Vue中计算属性和 watch的区别

通俗来讲，既能用computed 实现又可以用 watch 监听来实现的功能，推荐用 computed，重点在于 computed 的缓存功能

computed计算属性是用来声明式的描述一个值依赖了其它的值，当所依赖的值或者变量改变时，计算属性也会跟着改变；

watch 监听的是已经在 data 中定义的变量，当该变量变化时，会触发 watch 中的方法；

 

根据一个现有数据去生成一个新数据，并且这两个数据会永久的建立关系，还会建立缓存，当无关数据改变的时候，不会重新计算而是直接使用缓存中的值

 

<div id="app">
  <p>{{fullName}}</p>
</div>

<script>
  var vm = new Vue({
    el: '#app', 
    data: {
      firstName: 'si',
      lastName: 'li'
    },
    computed: {
      fullName() {
        return this.firstName + this.lastName
      }
    }
  })
</script>

　　fullName 不需要在 data 中声明