vxe-table复选框默认全选
时间: 2023-10-05 21:13:19 浏览: 142
你可以通过设置 `default-expand-all` 属性来默认展开表格中的所有行,并使用 `selection` 属性来启用复选框选择功能。这样,表格将默认选择所有行。
以下是一个示例:
```html
<template>
<div>
<vxe-table
:data="tableData"
:default-expand-all="true"
:selection="true"
:select-config="{ checkAll: true }">
<vxe-column type="selection" width="60"></vxe-column>
<vxe-column field="name" title="Name"></vxe-column>
<vxe-column field="age" title="Age"></vxe-column>
</vxe-table>
</div>
</template>
<script>
import 'vxe-table/lib/style.css'
import { Table, Column, Checkbox } from 'vxe-table'
export default {
components: {
VxeTable: Table,
VxeColumn: Column,
VxeCheckbox: Checkbox
},
data () {
return {
tableData: [
{ name: 'John', age: 22 },
{ name: 'Mike', age: 28 },
{ name: 'Amy', age: 19 }
]
}
}
}
</script>
```
在上面的示例中,我们设置了 `default-expand-all` 属性为 `true`,这将默认展开所有的行。然后,我们使用 `selection` 属性启用了复选框选择功能,并通过 `select-config` 属性设置了 `checkAll` 为 `true`,这将默认选择所有行。
阅读全文