vue el-table 表格數據復選框回顯

getRowKeys(row){ //唯一值，一般都是id
            return row.id;
        },

handleSelectionChange(val){ //只要復選框勾選了，就會打印

            console.info( val )

        },

　　

首先是 el-table 要綁定的東西

<el-table :row-key="getRowKeys"  ref="tableData1" :data="tableData1"  @selection-change="handleSelectionChange">
                    
</el-table>

　　

注意： ref 和 data 一定要綁定在同一個數組，保證數據的回顯。 

row-key 方法獲取 table 數據回顯，可以用於樹形結構的回顯

getLockDeptList(){

            this.$refs. 這里是你上面table 綁定的 table .toggleRowSelection( item ,true)//這樣就可以了

        },

// item 是你數據要勾選上的數據，例如： this.tableData1[i] 

　　

來自官方的騷操作，也是官方留下的坑

//解決上方回顯會勾上一些本身就不會被勾的數據回顯問題

//數據源解析： 

// this.studentTable 是你 el-table 綁定的 table 
//  this.userInfoList 是你從后台請求回來要回顯的數據

//特別注意： 一定要加一個 else ，不加else 會顯示上一些本身就沒有的數據


this.$nextTick(() => {
                        for( var j in this.studentTable ){

                            if( this.userInfoList.indexOf( this.studentTable[i].deptId ) != -1 ){
                                this.$refs.studentTable.toggleRowSelection(this.studentTable[i],true);
                            }else{
                                this.$refs.studentTable.toggleRowSelection(this.studentTable[i],false);
                            }

                        }
                        
                    })