Question

    data: function(){
            return {
            items: [
            { id: '1', name: 'Item 1', bool: false},
            { id: '2', name: 'Item 2', bool: false},
            { id: '3', name: 'Item 3', bool: false},
            { id: '4', name: 'Item 4', bool: false}
            ],
            checkedItems: [],
        };
    },

    methods: 
    {
        select: function(event, index) {
            if (!this.items[index].bool) {                    
                this.checkedItems.splice(index, 1);
            } else { 
                this.checkedItems.push(this.items[index]);
            }
        }
    }

当我单击div时，它将项目数据复制到checkedItems并将bool设置为true。

是否有可能确定项目ID并从checkedItems中删除该特定ID，因为当前的接头正在根据索引删除错误的项目。

Answer 1

为什么不使用对象而不是数组，就像这样：

data: function(){
            return {
            items: [
            { id: '1', name: 'Item 1', bool: false},
            { id: '2', name: 'Item 2', bool: false},
            { id: '3', name: 'Item 3', bool: false},
            { id: '4', name: 'Item 4', bool: false}
            ],
            checkedItemsObj: {},

        };
    },

    methods: 
    {
        select: function(event, index) {
            let item = this.items[index];

            if (!item.bool) {                    
                this.checkedItemsObj[item.id] = item 
            } else { 
                delete this.checkedItemsObj[item.id]  
            }
        },

        getCheckedItems: () => Object.values(data().checkedItemsObj)
    }

现在可以随时获取一组检查项目，您可以致电methods.getCheckedItems()

通过ID从数组中删除项目

1 个答案: