javascript - vuejs统计金额总和，使用计算属性吗？

问题描述

问 题

目前有这么个需求：
订单结算页面有多个订单。
我想通过订单各自的价格*数量，然后相加得出总共需要支付的金额，怎么计算？
//最后显示提示用户：总额：xxx元,去支付。
使用vuejs的computed属性进行计算吗？
那怎么循环多个订单进行乘法加法？

数据：

{
    "status": 1,
    "info": "订单信息",
    "data": [
        {
            "dcprice": null,
            "kitchen_status": "0",
            "discount_items": "1",
            "discount_id": "",
            "status": "0",
            "choice_dish_ingredients": "",
            "choice_taste": "",
            "price": "55.00",
            "quantity": "1.00",
            "give_quantity": "0.00",
            "cancel_quantity": "0.00",
            "dish_name": "菜品3",
            "pic": "",
            "dish_price": "55.00",
            "discount": "0.00",
            "introduce": "  ",
            "type": "1",
            "taste_name": null,
            "classify_name": "jjj",
            "type_name": "菜类型1"
        },
        {
            "dcprice": null,
            "kitchen_status": "0",
            "discount_items": "1",
            "discount_id": "",
            "status": "0",
            "choice_dish_ingredients": "",
            "choice_taste": "",
            "price": "4.00",
            "quantity": "2.00",
            "give_quantity": "0.00",
            "cancel_quantity": "0.00",
            "dish_name": "菜品1",
            "pic": "",
            "dish_price": "4.00",
            "discount": "0.00",
            "introduce": "   ",
            "type": "1",
            "taste_name": null,
            "classify_name": null,
            "type_name": "菜类型2"
        }
    ]
}

然后我的vue实例：

//dishorder 就是存着上面数据的变量
    new Vue({
        el:'#js_show_footer',
        data:dishorder,
        computed:{
            //计算总价,用于显示
            _price:function () {
                var allPrice=0;
                var i=0;
                //下面怎么写？
                /*for(){
                
                }*/
                return allPrice;
            }
        }
    });

解决方案

注意这几个属性：
循环this.$data.data 或者 this.data计算

这篇关于javascript - vuejs统计金额总和，使用计算属性吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！