zoukankan      html  css  js  c++  java
  • 解决使用element-ui的el-table组件显示树形数据时,多选框全选无法选中全部节点问题

    表格的数据像这样:projectEntryDtoList 字段中的数据为子级列表数据

    关于 el-table 组件实现树形数据这里不再过多赘述,文档在这里:https://element.eleme.cn/#/zh-CN/component/table

    首先设定一个全局变量  isSelectAll 表明是否为全选;

    为表格绑定点击全选时触发的方法 @select-all="handleSelectAll",同时给表格绑定ref,来获取组件实例 ref="projectEntryList";

    handleSelectAll() {
        this.isSelectAll = !this.isSelectAll
        this.changeSelectStatus(this.projectEntryList, this.isSelectAll)
    }

    对表格数据进行递归遍历,通过 toggleRowSelection 方法来对每一条数据进行操作

    changeSelectStatus(data, selected) {
        data.forEach(row => {
            this.$refs.projectEntryList.toggleRowSelection(row, selected)
            if (row.projectEntryDtoList) {
                this.changeSelectStatus(row.projectEntryDtoList, selected)
            }
        })
    }
  • 相关阅读:
    投资数据来源
    白酒
    医药
    农林牧渔
    软件IT
    基建
    ajax验证用户名 当用户名框的数据改变时 执行ajax方法
    jQuery load() 方法
    js各种验证文本框输入格式
    JAVASCRIPT技术 表达式验证
  • 原文地址:https://www.cnblogs.com/yejunm3/p/15090242.html
Copyright © 2011-2022 走看看