计算属性

计算属性

computed
methods和computed看起来都可以实现我们的功能，
那么为什么还要多一个计算属性这个东西呢？
原因：计算属性会进行缓存，如果多次使用时，计算属性只会调用一次。

    <div id="app">
        <h2 :style="{fontSize:fsize}">{{totalPrice}}</h2>
      </div>
      
      <script src="./demo/vue.js"></script>
      <script>
        const app = new Vue({
          el: '#app',
          data: {
            message: '你好啊',
            books: [{id:11,name:'黎明杀机',price:88},
                   {id:12,name:'黎明杀机2',price:99},
                   {id:13,name:'黎明杀机3',price:68},
                   {id:14,name:'黎明杀机4',price:568}
           ],
          },
          computed: {
              totalPrice:function() {
                  let result = 0;
                  for(let book of this.books){//挺好用= -

                    result += book.price;
                  }
                  return result;
              }
          }
        })
      </script> 
</body>