Element el-table 中 type=“selection“ 的列没法用 if 判断显示隐藏？？

最新推荐文章于 2024-08-09 09:15:23 发布

置顶

凌珞

最新推荐文章于 2024-08-09 09:15:23 发布

阅读量6.5k

点赞数 4

分类专栏： VUE ElementUI 文章标签： el-table ElementUI

本文链接：https://blog.csdn.net/dyp330/article/details/111041758

版权

在使用 Element UI 的 el-table 组件时，遇到 type='selection' 的列无法通过 if 条件控制显示和隐藏的问题。原因是源码中对 type='selection' 有特殊处理。解决方法是在 el-table 标签上添加一个动态 key，如 ':key="graduate"', 通过改变 key 值来触发表格重新渲染，从而实现列的动态显示隐藏。" 108560242,9549594,Ubuntu18.04完整卸载与安装Homebrew指南,"['Linux', 'Ubuntu', '包管理器']

摘要由CSDN通过智能技术生成

你是否也遇到了 Element el-table 中 type="selection" 的列没法用 if 判断显示隐藏？？

例如

/***此处还有两个 按钮graduate 一个 已毕业1 一个未毕业0 ,需求是当已毕业的时候 需要增加多选框，未毕业不需要增加多选框,点击按钮 切换页面表格中 多选框那列的显示隐藏
*****/
<el-table :data="tableData"  ref="multipleTable"
        @selection-change="handleSelectionChange" min-width="800" >
        <el-table-column v-if="graduate == 1"  type="selection" align="center" fixed="left" :reserve-selection="true">
        </el-table-column>  
        <el-table-column label="姓名" prop="name" min-width="100" align="center" ></el-table-column>
        <el-table-column label="学校" min-width=140 align="center" prop="school" > </el-table-column>
 
      </el-table>

//此处省略 获取tableData的代码