el-table选择后返回数据
时间: 2023-08-05 12:09:43 浏览: 36
在element-ui中,当我们使用el-table组件时,可以通过配置`@selection-change`事件监听表格选中项的变化。例如:
```html
<el-table
:data="tableData"
@selection-change="handleSelectionChange">
<el-table-column type="selection"></el-table-column>
<el-table-column prop="name" label="Name"></el-table-column>
<el-table-column prop="age" label="Age"></el-table-column>
</el-table>
```
在`handleSelectionChange`方法中,我们可以获取到选中的行数据,然后进行相应的操作。例如:
```js
methods: {
handleSelectionChange(selection) {
console.log(selection); // 打印选中的行数据
}
}
```
如果想获取选中的行数据中的某个字段,可以使用`Array.map`方法将选中的行数据转换为一个新的数组。例如:
```js
methods: {
handleSelectionChange(selection) {
const selectedIds = selection.map(item => item.id); // 获取选中行数据中的id字段
console.log(selectedIds); // 打印选中行数据中的id字段
}
}
```