Javascript 引导Vue表-从多个表中获取选择？

我一直在玩引导Vue和表格

我的问题如下：我在一个页面上动态加载了几个表，用户应该能够在每个表上选择项目。然后，所有选择都应该连接到一个数组中，我可以在页面顶部显示该数组

到目前为止，我已将以下内容添加到每个表中：

@row-selected="onRowSelected"

以及以下方法：

methods: {

            onRowSelected(items) {

                items.forEach((item) => {
                    if (!this.selectedHashtags.includes(item.hashtag)) {
                        this.selectedHashtags.push(item.hashtag);
                    }
                })

            },
}

问题是，只要我从表中取消选择一个项，它就不会从数组中删除它，我正在努力找到一种方法来实现这一点

不幸的是，@row selected事件没有发送表的ID/ref，我也找不到从每个表中获取所有选定行的方法。这样，我就可以循环使用所有的this.$refs，获得所有选定的行，并在每一行单击时将它们捆绑在一起

从本质上讲，最简单的方法是，是否有一种从表中以编程方式获取所有选定项的方法

---

关于实现这一点的最佳方法有什么想法吗？

最简单的方法可能是将选定的值与每个表的唯一键一起存储。然后使用关键字$event调用类似的方法，请参见：

您还可以在模板中包装内联函数以获得相同的结果：

@row-selected="(items) => onRowSelected('table1', items)"

然后，根据表键将项目存储在对象中：

onRowSelected(tableKey, items) {
  // clears the list of this table key and overwrites it with the current entries
  this.selectedHashtags[tableKey] = items;
}

然后，您可以定义一个计算变量来检索所有表上所有选定的hashtag：

allSelectedHashtags() {
   const allSelectedHashtags = [];
   Object.keys(this.selectedHashtags).forEach(tableArray => {
     allSelectedHashtags.concat(tableArray);
   });
   return allSelectedHashtags;
}

---

在单独的数组中收集特定表的所有选定行。添加一个名为like allSelectedRows的计算属性，其中只返回所有表中所有选定行数组的连接数组。很漂亮！这需要一些调整，使它完全符合我的要求，但@row selected上的内联函数正是我所需要的，谢谢！

allSelectedHashtags() {
   const allSelectedHashtags = [];
   Object.keys(this.selectedHashtags).forEach(tableArray => {
     allSelectedHashtags.concat(tableArray);
   });
   return allSelectedHashtags;
}