Element-ui 中table 默认选中 toggleRowSelection

toggleRowSelection(row, selected)接受两个参数，row传递被勾选行的数据，selected设置是否选中

 

注意：调用toggleRowSelection这个方法 需要获取真实dom 所以需要注册 ref 来引用它 

 

二.操作

 

(一).默认选中

 

1.当数据源固定在table的

 

<script>

export default {   

mounted() {

    this.$refs.multipleTable.toggleRowSelection(this.tableData3[2],true);

}

}

</script>

 

(二).点击tr选中

 

1.在table中设置 @row-click="handleCurrentChange"

 

row-click  点击行事件

 

<template>

<el-table :data="tableData3"  ref="multipleTable" @row-click="handleCurrentChange">

</el-table>

</template>

<script>

export default {   

methods: {

handleCurrentChange(row, event, column){

this.$refs.multipleTable.toggleRowSelection(row,true);//点击选中

}

    }

}

</script>

 

(三).获取选中的值

 

1.设置table 中@selection-change="selsChange"

 

2.data 中设置sels:[]

 

<template>

<el-table :data="tableData3"  ref="multipleTable" @row-click="handleCurrentChange" @selection-change="selsChange">

</el-table>

</template>

<script>

export default {   

methods: {

selsChange( val){

this.sels=val;

console.log(this.sels)

}

    }

}

</script>