Vue计算

作者: 莫以有 | 来源:发表于2019-03-13 22:19 被阅读0次

    简单计算手机的总价:

     {{goods.属性名}}
    
    • 用双花括号获取手机的各种属性,比如手机名称,价格等等,因为涉及到各个手机的各个属性,我们用数组对这些属性进行定义
    goodsList: [{
                    id: ,
                    name: '',
                    super: '',
                    imgurl: '',
                    price: ,
                    count: 
                        }   
                ]
    
    computed: {
                        totalPrice: function() {
                            var totalPrice = 0;
                            var len = this.goodsList.length;
                            for (var i = 0; i < len; i++) {
                                totalPrice += this.goodsList[i].price * this.goodsList[i].count;
                            }
                            return totalPrice;
                        },
    
    • 用以计算总价格的简单函数,又对应的手机price*对应的额手机count ,并返回总价格
    settlement: function() {
                            this.show = true;
                            var totalCount = 0;
                            var len = this.goodsList.length;
                            for (var i = 0; i < len; i++) {
                                totalCount += this.goodsList[i].count;
                            }
                            return totalCount;
                        }
    
    • 用来返回提示语句

    • 注意部分:

           /* 垂直方向居中 */
            align-items: center;
            /* 水平方向居中 */
            justify-content: center;
    
           /*手机的个数限制在不能为零以下*/
            disabled="goods.count===0
    

    相关文章

      网友评论

          本文标题:Vue计算

          本文链接:https://www.haomeiwen.com/subject/xzexmqtx.html