vben admin table选中
时间: 2023-10-18 19:14:54 浏览: 221
我不确定您在问什么,但如果您正在寻找有关vben管理表格中选择行的信息,请参考以下代码示例:
1. 在vben管理表格中,要选择行,请使用以下代码:
```
<template>
<vb-table
:columns="columns"
:data="data"
:row-selection="{
onChange: handleOnChange,
type: 'checkbox',
}"
/>
</template>
<script>
export default {
data() {
return {
columns: [
{
title: 'Name',
dataIndex: 'name',
},
{
title: 'Age',
dataIndex: 'age',
},
{
title: 'Address',
dataIndex: 'address',
},
],
data: [
{
key: '1',
name: 'John Brown',
age: 32,
address: 'New York No. 1 Lake Park',
},
{
key: '2',
name: 'Jim Green',
age: 42,
address: 'London No. 1 Lake Park',
},
{
key: '3',
name: 'Joe Black',
age: 32,
address: 'Sidney No. 1 Lake Park',
},
],
};
},
methods: {
handleOnChange(selectedRowKeys, selectedRows) {
console.log('selectedRowKeys:', selectedRowKeys);
console.log('selectedRows:', selectedRows);
},
},
};
</script>
```
2. 在上面的代码中,我们使用`row-selection` prop来启用行选择。我们将`type`设置为`checkbox`以启用多选。
3. 当用户选择行时,将触发`handleOnChange`方法。在此方法中,我们可以访问已选择的行。`selectedRowKeys`是已选择行的键列表,`selectedRows`是已选择行的完整数据列表。
希望这可以帮助到您。
阅读全文