VUEcomputed（计算属性）

computed（计算属性）

计算属性 有依赖关系的数据

我们希望一个变量是经过某种计算然后输出而不是直接输出的时候可以使用到计算属性 计算属性是基于它们的响应式依赖进行缓存的。只在相关响应式依赖发生改变时它们才会重新求值。而每次调用函数都会导致函数的重新执行。

### html代码
    <div id="app">
        {{msg}}
        <br>
        a：<input type="text" v-model.number="a">
        <br>
        +
        <br>
        b：<input type="text" v-model.number="b">
        <br>
        =
        <br>
        {{total}}
      </div>	
    ### js代码
        new Vue({
          el: '#app',
          data: {
            msg: 'hello',
            a: 0,
            b: 0,
            // total: 0
          },
          // 计算属性
          computed: {
            total(){
                console.log('计算属性');
                // return 111
                return this.a+this.b
            }
          },
          methods: {}
        })