批量删除功能 element-plus

第一步：建立多选删除按钮

<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)
	}