【element-ui】 多个table分别对应的多选框选中后部分禁用selectable的用法

    技术2022-07-10  128

    HTML:

    <span @click="addPersonFunc('2')"> <i class="el-icon-circle-plus">添加人员</i> </span> <el-dialog title="添加人员" :visible.sync="dialogTableVisible"> <el-table :data="personList"> //selectable的用法 <el-table-column type="selection" width="55" :selectable="checkboxT" disabled="true"></el-table-column> <el-table-column type="index" label="序号"></el-table-column> <el-table-column prop="name" label="姓名"></el-table-column> <el-table-column prop="departName" label="部门"></el-table-column> </el-table> <el-pagination> //。。。。。分页省略 </el-pagination> <div class="winBox"> <el-button type="success" @click="okFunc">确定</el-button> <el-button type="primary" @click="cancelFunc">取消</el-button> </div> </el-dialog>

    method:

    addPersonFunc(val) { this.dialogTableVisible = true; //temple是一个我自定义的临时参数,用来存放val (此处的val为数值) this.temple = val; }, checkboxT(row, index) { if ( // this["arr" + this.temple]相当于this.arrtemple //例子:如果this.temple=1,那么this["arr" + this.temple]相当于:this.arr1 this["arr" + this.temple].some(item => { //some()方法请看文章后面的文字 return item.personCode === row.username; }) ) { return false; } else { return true; } },

    关于some() some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。

    some() 方法会依次执行数组的每个元素: 如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。 如果没有满足条件的元素,则返回false。

    注意: some() 不会对空数组进行检测。 注意: some() 不会改变原始数组。 关于selectable的说明:

    Processed: 0.036, SQL: 9