Table
<template>
<div class="table-wrap">
<memoDialog ref="memoDialogRef" />
</div>
</template>
<script setup>
const memoDialogRef = ref();
async function obsolete(row) {
const action = "canceled";
const memo = await memoDialogRef.value.openDialog({ action });
handleExecute(row, action, memo);
}
</script>
Dialog
<template>
<el-dialog title="标题" v-model="dialogVisible" :before-close="closeDialog">
<template #footer>
<div class="dialog-footer">
<el-button @click="onReset">取消</el-button>
<el-button type="primary" @click="submit">确定</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
const dialogVisible = ref(false);
function onInit() {
// 初始化
}
function onReset() {
// 重置
}
function closeDialog() {
dialogVisible.value = false;
onReset();
}
var openDialogPromise;
async function openDialog(...args) {
dialogVisible.value = true;
onInit(...args);
return new Promise((resolve, reject) => {
openDialogPromise = { resolve, reject };
});
}
async function submit() {
// ...
openDialogPromise.resolve(/* data */);
}
defineExpose({
openDialog,
});
</script>