• Element 懒加载表格el-table数据实现全选功能


    <el-table 
              v-loading="loading.list"
              ref="table"
              :data="tableData"
              style=" 100%"
              max-height="400"
              border
              lazy
              row-key="key"
              :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
              :load="load"
              :header-cell-class-name="cellClass"
              @select="selectRow"
              @selection-change="selectionChange"
                        @select-all="selectAll">
              <el-table-column
                type="selection"
                width="55">
              </el-table-column>
              <el-table-column prop="key" label="编号"></el-table-column>
              <el-table-column prop="identityName" label="姓名"></el-table-column>
            </el-table>
    data() {
        return {
          form: {
            dimId: 1,
            name: '',
            key: '',
            tenantId: ''
          },
          treeData: [],
          tableData: [],
          loading: {
            tree: false
          },
          multipleSelection: [],
          tableAllData: [], // 存储所有的表格数据
          checkAll: false, // 判断当前是否全选
        } 
      },
    // 全选
    selectAll(selection) {
          this.checkAll = !this.checkAll;
          this.tableAllData.map(row => {
            this.$refs.table.toggleRowSelection(row, this.checkAll);
          })
    }, async load(row, treeNode, resolve) {
    try { let self = this; let params = { parentId: row.groupId, groupId: row.groupId } const data = await getOrganizeList({ ...self.form }, params) let arr = data.map(item => { return { ...item, hasChildren: item.childs && item.childs > 0, children: [] } }) this.tableAllData = this.tableAllData.concat(arr) // 保存表格数据 resolve(arr) return } catch (error) { console.log(error) } },
  • 相关阅读:
    java 求 1!+2!+3!+....+10!的和为
    Java 循环控制语句
    java for 循环 九九乘法表
    Java for 循环
    Java while 和 do...while
    Java if语句
    Java switch 语句
    java a++ 和 ++a 理解
    Java 自动转换和强制转换
    二叉树遍历
  • 原文地址:https://www.cnblogs.com/fczbk/p/14062495.html
Copyright © 2020-2023  润新知