element ui 表格全选与否

来源：互联网发布：网络名誉侵权证据编辑：程序博客网时间：2024/06/08 11:04

虽然element ui 的接口提供了全选与反选，可是当我有多条数据时，

选中了某一条，再点全选/反选按钮时，会出现异常情况。下面是解决办法，

template部分：

<template>  <div class="operator">    <el-button @click="toggleSelect(tableData)" size="mini">全选/反选</el-button>    <el-button @click="deleteSelect" type="danger" size="mini">删除</el-button>  </div></template>

js部分

<script>  export default {    data() {      return {        // 表格数据        tableData: [          {            userCode: '8511110101',            name: '王1虎',            roomNumber: '17-203',            userType: '自付',            heatingArea: '80㎡',            year: '2016-2017'          }        ],        // 列表全选与否        allSelect: false      }    },    methods: {      toggleSelect(rows) {        if (rows) {          rows.forEach(row => {            this.$refs.multipleTable.toggleRowSelection(row, !this.allSelect)          })          this.allSelect = !this.allSelect        }      }    }  }</script>

界面部分

阅读全文

0 0