第一步:建立多选删除按钮
<el-button type="danger"
size="small"
@click="handlerMuchDel"
v-if="mutipleSelection.length">
多选删除
</el-button>
第二步:在要删除table中添加多选框
<el-table :data="tableData" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55"/>
</el-table>
以及script setup部分
// 批量删除
// 获取要删除的多条记录
const mutipleSelection= ref([]) //定义空数组,临时存放数据
const handleSelectionChange = (val)=>{
mutipleSelection.value = val
}
const handlerMuchDel = ()=>{
mutipleSelection.value.forEach(row=>{
const index = tableData.indexOf(row)//indexOf获取表里的下标
handlerDel(index,1)
})
}
//删除单个
const handlerDel = (index)=>{
tableData.splice(index,1)
}