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 一定要绑定在同一个数组，保证数据的回显。 

1	<strong>row-key 方法获取 table 数据回显，可以用于树形结构的回显</strong><br><br><br>

getLockDeptList(){

this.$refs. 这里是你上面table 绑定的 table .toggleRowSelection( item ,true)//这样就可以了

},

// item 是你数据要勾选上的数据，例如： this.tableData1[i]

1	来自官方的骚操作，也是官方留下的坑<br><br>

//解决上方回显会勾上一些本身就不会被勾的数据回显问题

//数据源解析：

// 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);

    }

  }

})

el-table中的代码为：

this.$refs.orderItemListTableRef.toggleRowSelection(selectedItemList[i],true);

umy-ui中的代码需添加“.$refs.singleTable”才能正常运行，否则会报“数据格式需要一个数组”错误：

this.$refs.orderItemListTableRef.$refs.singleTable.toggleRowSelection(selectedItemList[i],true);

umy-ui某些方法的实现不同于el-table，需要添加.$refs.singleTable才能正常运行，大家可以尝试一下。