element-ui —— 表格多选默认全部勾选

最新推荐文章于 2024-11-25 11:24:29 发布

爱吃果蔬的猫

最新推荐文章于 2024-11-25 11:24:29 发布

阅读量796

点赞数 2

文章标签： elementui vue.js 前端

本文链接：https://blog.csdn.net/qq_53895518/article/details/141863227

版权

html代码：

<template>
  <el-table
    :data="tableData"
    ref="multipleTable"
    @selection-change="handleSelectionChange"
    style="width: 100%">
    <el-table-column
      type="selection"
      width="55">
    </el-table-column>
    <!-- 其他列 -->
  </el-table>
</template>

js代码：

<script>
export default {
  data() {
    return {
      tableData: [],
      multipleSelection: []
    };
  },
  mounted() {
    this.fetchData();
  },
  methods: {
    fetchData() {
      // 模拟从服务器获取数据
      this.tableData = [
        // 填充数据
      ];
    },
    setDefaultSelections() {
      // 假设你想默认勾选所有行
      this.tableData.forEach(row => {
        this.$refs.multipleTable.toggleAllSelection(row, true);  //重点在这行数据
      });
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    }
  }
};
</script>