element ui --table 点击每行实现选中效果、多选、全选、及禁选。

element ui table里 自带Checkbox组件，所以结合组件自身实现单击每行，实现这行的选中效果。代码如下:

<el-table border 
       v-show="blurShow"
       :row-class-name="tableRowClassName"
       @row-click="getAddLisy"
       @selection-change="handleSelectionChange"
       ref="multipleTable"
       :data="searchData">
       <el-table-column 
                type="selection"
                width="55"
                :selectable="selectabele">
       </el-table-column>
       <el-table-column align="center" prop="materialCode" label="物料编码">
                <template slot-scope="scope">
                        <span v-if="scope.row.materialCode">{{scope.row.materialCode | sliceNumber}}</span>
                </template>
       </el-table-column>
       <el-table-column align="center" prop="materialDesc" label="物料描述"></el-table-column>
</el-table>

方法：

 // 点击每行添加数据
      getAddLisy(row){
            if(!row.disabled){
                this.$refs.multipleTable.toggleRowSelection(row);
            }else{
                console.log('已添加了该耗材')
            }
        },
  // 全选
        handleSelectionChange(val) {
            this.selectionChangeList = val;
        },
        // 多选框根据条件禁止选择
        selectabele(row){
            if(row.isChecked){
                this.$set(row,'disabled',true);
                return false
            }else{
                return true
            }
        },

selectionChangeList 为选中的数据组成的数组。