element 表格如下
<el-table :row-class-name="tableRowClassName" ref="pageTable" row-key="oid" :data="tableData" style="width: 100%"><el-table-column type="selection" width="55" reserve-selection :selectable="selectEvent"></el-table-column><el-table-column type="index" label="序号"></el-table-column><el-table-column prop="clause" label="标题1" width="150"></el-table-column><el-table-column prop="chapter" label="标题2" width="150"></el-table-column><el-table-column prop="reguNumber" label="标题3" width="150"></el-table-column><el-table-column prop="title" label="标题4"></el-table-column>
</el-table>1、禁用多选框
在表格的 selection 上 增加 :selectable="selectEvent" 内容
在methods 中 增加如下函数
methods:{selectEvent(row){if(row.alreadyAdded){ // 这里是根据 alreadyAdded 的 状态 判断的 禁用 多选框，返回true 不禁用 返回falsereturn false;}else {return true;}}
}2、根据状态 更改表格颜色
在表格的 table 上 增加 :row-class-name="tableRowClassName" 内容
methods:{tableRowClassName(row){if(row.row.alreadyAdded){return 'success-row';}else {return "";}},}根据不同的状态返回不同的 样式名字 然后在样式中 增加如下内容
< style lang = "less" scoped>/deep/.success-row >td {background: #F6F6F6 !important;
}
</style>这里面可以 用 scoped 的；只需要在样式 前面增加深度选择器 /deep/ ，具体 可自行在网上查找，其用法。
参考 多个博客，具体不再追加；需要追加请作者留言，必追加出处。