vxetable 如何删除checkbox选择的行
时间: 2023-02-09 16:00:31 浏览: 182
在 vxetable 中删除 checkbox 选择的行,你可以像下面这样做:
1. 在 vxetable 组件的模板中,添加一个删除按钮,并绑定一个删除方法。
2. 在删除方法中,使用 vxetable 组件的 $clearSelect() 方法来清除所有的选择。
3. 使用 vxetable 组件的 $getCheckboxRecords() 方法来获取所有被选中的行。
4. 循环遍历被选中的行,并使用 vxetable 组件的 $remove() 方法来删除这些行。
例如:
```
<template>
<vxetable
ref="table"
:data="data"
:columns="columns"
>
<template #footer-right>
<button @click="handleDelete">删除</button>
</template>
</vxetable>
</template>
<script>
export default {
data() {
return {
data: [],
columns: []
}
},
methods: {
handleDelete() {
this.$refs.table.clearSelect()
const records = this.$refs.table.getCheckboxRecords()
records.forEach(row => {
this.$refs.table.remove(row)
})
}
}
}
</script>
```
阅读全文