vue项目 : 解决element-ui多选框如何禁用的问题

一、问题描述

使用了组件库中的表格多选框,<el-tabel-column>的type为selection,要根据当前行的是否存在某个需要判定的数据来决定当前行的多选框按钮是否可用

 二、解决方法

在组件库中我们找到了相关属性(仅适用于type=selection):

 三、使用案例

模板代码

<el-table v-loading="loading"
          :data="tableData"
          :header-cell-style="headerCellStyle"
          @selection-change="getInfo">
                <el-table-column
                    type="selection"
                    :selectable="selectEnable">
                </el-table-column>
</el-table>

js代码(写在methods中)

selectEnable(row) {
            if (row.realExitDateStr) {
                return false
            } else {
                return true
            }
        }

达到的效果:

 当最后一列数据为空时,多选框可选。


版权声明:本文为qq_45867474原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。