Используйте type='selection' в таблице element-ui для отключения, проверки, и три состояния, которые нельзя изменить, выбираются по умолчанию для отображения проблем.

Используйте type='selection' в таблице element-ui для достижения 禁用проблем с отображением трех состояний 勾选.默认选中不可修改

добиться эффекта

нуждаться

1. status=‘CheckOk'Когда флажок 默认选中但不可修改установлен.
2. status=‘CheckFail'Когда флажок 禁用
установлен. 3. status=‘'Когда флажок установлен.可以勾选

Идеи реализации

Используйте флажок type='selection', который поставляется с формой el-table, чтобы добиться

Реализуйте 1. status=‘CheckOk'Когда флажок 默认选中但不可修改установлен

1. Сначала реализуем выбор по умолчанию

toggleRowSelection : для таблиц с множественным выбором есть два параметра ( row, selected)
, которые позволяют переключать выбранное состояние строки. Если используется второй параметр, он определяет, выбрана ли эта строка или нет (выбрано значение true, затем выбрано)

methods：{
    
    
	    // status=‘CheckOk' 默认选中
     defaultChecked() {
    
    
            var that = this;
            that.$nextTick(() => {
    
    
                this.tableData.forEach((v, i) => {
    
    
                    if (v.status == 'CheckOk') {
    
    
                        this.$refs.table.toggleRowSelection(v, true);
                    }
                });

            });
           } 
   },

Установите тип добавляемого столбца таблицы selection.:selectable='方法名’

  <el-table-column type="selection" width="50" :selectable="selectable" />

methods: {
    
    
	 //判断勾选
        selectable(row, index) {
    
    
            if (row.status == 'CheckFail' || row.status == 'CheckOk') {
    
    
                return false;
            } else {
    
    
                return true;
            }
        },
}
        

полный код

     <el-table ref="table" 
               :header-cell-style="{ color: '#FFF', background: '#333' }" 
               :data="tableData"
               style="width: 100%" :row-key="getRowKey" 
               :row-style="tableRowStyle"
               @selection-change="handleSelectionChange">
        <template slot="empty">
            <span style="color: #969799">{
   
   { $t("NeoLight.empty") }}</span>
        </template>
        <el-table-column type="selection" width="50" :selectable="selectable" />
        <el-table-column prop="ri" :label="$t('outSideShelf.ri')" />
        <el-table-column prop="needNum" :label="$t('outSideShelf.needNum')" />
        <el-table-column prop="status" :label="$t('outSideShelf.status')" />
</el-table>

mounted(){
    
    
this.defaultChecked() // 该方法可以在拿到表格数据后进行调用
}
methods: {
    
    
    // status=‘CheckOk' 默认选中
     defaultChecked() {
    
    
            var that = this;
            that.$nextTick(() => {
    
    
                this.tableData.forEach((v, i) => {
    
    
                    if (v.status == 'CheckOk') {
    
    
                        this.$refs.table.toggleRowSelection(v, true);
                    }
                });
            });
          } 
	 //判断勾选
        selectable(row, index) {
    
    
            if (row.status == 'CheckFail' || row.status == 'CheckOk') {
    
    
                return false; // 禁用
            } else {
    
    
                return true; //不禁用
            }
        },
        // status=‘CheckFail' 该行背景为灰色
         tableRowStyle({
     
      row, rowIndex }) {
    
    
            let rowBackground = {
    
    };
            if (row.status == 'CheckFail') {
    
    
                rowBackground.background = '#6d6d6d';
                rowBackground.color = "#fff";
            } else {
    
    
                rowBackground.background = "#333";
                rowBackground.color = "#fff";
            }
            return rowBackground;
        },
}