computed计算属性 购物车功能

computed计算属性 用来监控自己定义的变量,该变量不再data里面声明,直接在computed里面定义,然后就可以在页面上进行双向数据绑定展示出结果或者用作其他处理;

购物车代码:
checkValue是一个空数组 当选中多选框 数组就会增加一项
money是数组中每一项的和


<input type="checkbox" v-model="checkValue" :value="item.product_price*item.num">
<span style="color: red">{{money}}</span>
        computed:{
            money:function () {
                let sum=0
                for(var i=0;i<this.checkValue.length;i++){
                    sum+=this.checkValue[i];
                }
                return  sum;
            }

    },

因为我本人对computed 和 watch 和methods也没有知道很深 所在了解了一下

computed是计算属性,methods是方法,computed是依赖缓存的,只有当依赖发生改变时才会重新弄求值 但是方法 每次刷新都会运行

计算属性是通过其他变量(可能不止一个)计算得来的另一个属性 不用再data里面写 不支持异步 当compute内有异步操作时无效
watch监听器 侦听一个特定的值 支持异步
另外,computed属性属性值是函数,那么默认会走get方法;函数的返回值就是属性的属性值;在computed中的,属性都有一个get和一个set方法,当数据变化时,调用set方法。

你可能感兴趣的:(computed计算属性 购物车功能)