vxe-table怎么获取复选框取消勾选的当条数据
时间: 2024-11-27 15:14:43 浏览: 58
vxe-table是一个基于Vue的高性能表格组件,它支持VueX及自定义事件驱动的交互。要获取复选框取消勾选时的对应行数据,你可以通过监听`@on-selection-change`事件,并在回调函数中检查选中的值变化。
首先,在你的组件模板上绑定这个事件:
```html
<vxe-table @on-selection-change="handleSelectionChange" ...>
<!-- 表格配置 -->
</vxe-table>
```
然后,在methods里定义处理选择改变的函数 `handleSelectionChange`:
```javascript
export default {
methods: {
handleSelectionChange(selection) {
if (!selection || !selection.length) { // 如果没有任何项被选中
const currentData = this.currentlySelectedData; // 这里的currentData应该是保存已选数据的地方
console.log('取消勾选时的数据:', currentData);
} else {
// 处理单个或多个项被取消选中的情况
}
},
// 其他方法...
currentlySelectedData: [], // 初始化一个空数组来存储当前选中的数据
},
}
```
在这个函数中,当你希望获取到的是被取消勾选之前的最后一个选择数据,可以查看`currentlySelectedData`数组。如果需要实时获取,可以在此处更新数据状态。
阅读全文