直播app原始碼，map實現購物車選擇功能

直播app原始碼，map實現購物車選擇功能

HTML程式碼：

 //購物車列表選中
<checkbox v-bind:checked="item.isSelect" @click="item.isSelect=!item.isSelect"></checkbox>
 
 
 
//底部全選
<checkbox-group>
    <checkbox @click="selectProduct(isSelectAll)" v-bind:checked="isSelectAll" />全選
 </checkbox-group>

JS程式碼：

        //賦值給陣列
        方法名() {
                var _this = this
                axios.get('介面地址', {引數}).then(function (res) {
                    _this.list = res.data
                    /*賦值，是否選中*/
                    _this.list.map(function (item) {
                        _this.$set(item, 'isSelect', true);
                    })
                }).catch(function (err) {
                    console.log(err)
                })
            },
 
            selectProduct(_isSelect) {
                //遍歷List，全部取反
                for (var i = 0, len = this.list.length; i < len; i++) {
                    this.list[i].isSelect = !_isSelect;
                }
            },

vue中computed函式：

 isSelectAll() {
                //如果List中每一條資料的isSelect都為true，返回true，否則返回false;
                return this.list.every(
                    function (val) {
                        return val.isSelect
                    });
            },

這樣就實現了購物車的商品選擇功能。

以上就是直播app原始碼，map實現購物車選擇功能 更多內容歡迎關注之後的文章