【element-plus】使用elTable设置默认全选toggleRowSelection失效

在Element Plus中，如果你使用el-table组件并尝试通过toggleRowSelection方法设置默认全选，但发现该方法失效，可能是因为在表格数据初始化之前就调用了这个方法，或者是因为表格的row-key属性没有正确设置。

解决方法：

1. 确保在表格数据被正确设置之后调用toggleRowSelection方法。你可以在数据被响应式属性赋值后的Vue生命周期钩子中调用，例如mounted钩子。
2. 确保你为el-table组件设置了row-key属性，并且这个属性值对应的是每行数据中唯一标识的字段名。如果没有设置row-key或者row-key设置不当，Vue将无法追踪每行的状态，可能导致toggleRowSelection方法失效。

示例代码：

<template>
  <el-table
    :data="tableData"
    ref="multipleTable"
    @selection-change="handleSelectionChange"
    row-key="id" <!-- 确保这里设置了正确的row-key -->
  >
    <el-table-column
      type="selection"
      width="55">
    </el-table-column>
    <!-- 其他列 -->
  </el-table>
</template>
 
<script>
export default {
  data() {
    return {
      tableData: [],
    };
  },
  mounted() {
    this.toggleAllSelection();
  },
  methods: {
    toggleAllSelection() {
      this.$nextTick(() => {
        this.$refs.multipleTable.toggleAllSelection();
      });
    },
    handleSelectionChange(selection) {
      // 处理选中项变化
    }
  }
};
</script>

在这个例子中，我们在mounted钩子中调用了toggleAllSelection方法，该方法在$nextTick回调中执行了toggleAllSelection，以确保在DOM更新后再执行全选操作。同时，我们设置了row-key属性为"id"，这个属性值应该对应你数据中每个对象的唯一标识属性。