使用 vxe-table 将行数据标记为删除状态

vxe-table 如何将行标记为删除状态，不是直接删除
官网：https://vxetable.cn

vxe-table 支持直接将数据标记待删除状态，通过调用 setPendingRow 方法标记为待删除状态

1. <template>
2.   
3.     <vxe-button status="error" @click="pendingSelectEvent(true)">批量标记除</vxe-button>
4.     <vxe-button status="info" @click="pendingSelectEvent(false)">批量取消标记</vxe-button>
5.     <vxe-button status="success" @click="getPendingEvent">获取已标记数据</vxe-button>
6.     <vxe-table
7.       border
8.       show-overflow
9.       keep-source
10.       height="400"
11.       ref="tableRef"
12.       :edit-config="editConfig"
13.       :data="tableData">
14.       <vxe-column type="checkbox" width="70"></vxe-column>
15.       <vxe-column field="name" title="Name" :edit-render="{name: 'input'}"></vxe-column>
16.       <vxe-column field="sex" title="Sex" :edit-render="{name: 'input'}"></vxe-column>
17.       <vxe-column field="age" title="Age" :edit-render="{name: 'input'}"></vxe-column>
18.       <vxe-column field="action" title="操作" width="200">
19.         <template #default="{ row }">
20.           <vxe-button mode="text" status="error" @click="pendingRow(row, true)">标记</vxe-button>
21.           <vxe-button mode="text" @click="pendingRow(row, false)">取消</vxe-button>
22.         </template>
23.       </vxe-column>
24.     </vxe-table>
25.   
26. </template>

复制代码

https://gitee.com/x-extends/vxe-table

来源：程序园用户自行投稿发布，如果侵权，请联系站长删除
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！