vue复选框选中保存获取当前表格所有选中的数据

在Vue.js中，处理表格中的复选框选中状态通常涉及组件的数据绑定以及事件监听。当你有一个表格并且每个单元格包含一个复选框，你可以这样做：

1. 首先，在你的Vue实例中定义一个数组，用于存储选中的行数据。例如：

data() {
  return {
    selectedItems: [], // 初始化为空数组
    tableData: [] // 表格数据
  }
}

2. 当用户点击复选框时，你可以添加一个`@change`事件监听器来更新`selectedItems`数组。假设复选框的值为true表示选中：

<tr v-for="(item, index) in tableData">
  <td><input type="checkbox" :value="index" @change="$emit('selectItem', index)" /></td>
  <!-- 其他列内容 -->
</tr>

这里，我们绑定了`value`属性为表数据的索引，并在`@change`事件触发时发送一个自定义事件`selectItem`，携带选中的行索引。

3. 在模板外，监听这个`selectItem`事件并更新`selectedItems`：

<template>
  ...
</template>

<script>
export default {
  methods: {
    selectItem(index) {
      this.selectedItems.includes(index) ? this.selectedItems.splice(this.selectedItems.indexOf(index), 1) : this.selectedItems.push(index);
    },
  },
  ...
}
</script>

现在，每当复选框状态改变，`selectedItems`就会反映当前表格的所有已选择行的索引。