按钮
<el-popconfirm confirm-button-text="确定" cancel-button-text="取消"
:icon="InfoFilled" icon-color="var(--el-color-danger)" title="确定要删除选中的记录?"
@confirm="deleteAll">
<template #reference>
<el-button type="danger" :icon="Delete"
v-show="selectionList.length > 0" style="margin-left:22px;">批量删除
</el-button>
</template>
</el-popconfirm>
table(在第一列加小选择框)
<el-table :data="dataList" @selection-change="selectId" row-key="id">
<el-table-column type="selection" :reserve-selection="true" width="50" />
方法
const selectionList = ref([]);
function selectId(sele) {
selectionList.value = [];
if (sele.length > 0) {
sele.forEach(obj => {
selectionList.value.push(obj.id);
})
}
}
function deleteAll() {
let postData = {
"idList": selectionList.value
}
axios.post('delete', postData).then(res => {
if (res && res.data && res.data.meta && res.data.meta.success) {
ElMessage.success("删除成功!");
selectionList.value = []
} else {
ElMessage.error(res.data.meta.message);
}
}).catch(error => {
console.log(error);
})
}