Vue购物车商家全选

首先给数组每个数据加个checked
用selectCheckItemId记住选择的Id

  mounted() {
            this.cartList.forEach(item => {
                this.$set(item, "checked", false) //Vue 解决不能检测到对象属性的添加或删除
                if (item.orderItemList) {
                    item.orderItemList.forEach((citem) => {
                        this.$set(citem, "checked", false)
                    })
                }
            });
        },

商品全选

  //全选
            checkAll() {
                this.cartList.forEach(item => {
                    item.checked = this.checkedAll;
                    if (item.orderItemList) {
                        item.orderItemList.forEach(citem => {
                            citem.checked = this.checkedAll;
                            if (this.checkedAll) {
                                this.selectCheckItemId.push(citem.itemId);
                            } else {
                                this.selectCheckItemId = [];
                            }
                        })
                    }
                })
            },

商家全选

   //商家全选
            _checkAll(val) {
                val.orderItemList.forEach(item => {
                    item.checked = val.checked;
                    if (val.checked) {
                        this.selectCheckItemId.push(item.itemId);
                    } else {
                        let index = this.selectCheckItemId.indexOf(item.itemId);
                        this.selectCheckItemId.splice(index, 1);
                    }
                });
                //全选判断 如果商家全选则勾选全选
                if (this.cartList.every(item => item.checked)) {
                    this.checkedAll = true;
                } else {
                    this.checkedAll = false;
                }
            },

商品全选

  //商品选择框
            handleCheck(item, index) {
                var check = []; //用于存放商家的checked
                this.cartList.forEach((items, index) => {
                    if (items.orderItemList) {
                        //判断是否商品全选
                        var bool = items.orderItemList.every(citem => citem.checked);
                        if (bool) {
                            //商品全选则勾选对应商家
                            items.checked = true;
                        } else {
                            items.checked = false;
                        }
                        check.push(bool);
                    }
                })

                if (item.checked) {
                    this.selectCheckItemId.push(item.itemId);
                } else {
                    let index = this.selectCheckItemId.indexOf(item.itemId);
                    this.selectCheckItemId.splice(index, 1);
                }
                //如果商家全选则勾选全选
                if (check.indexOf(false) == -1) {
                    this.checkedAll = true;
                } else {
                    this.checkedAll = false;
                }

            },