48 lines
1022 B
Vue
48 lines
1022 B
Vue
<docs>
|
||
---
|
||
order: 7
|
||
version: 3.0
|
||
title:
|
||
zh-CN: 基于 Promise 的异步关闭 (3.0+)
|
||
en-US: Asynchronously close on Promise (3.0+)
|
||
---
|
||
|
||
## zh-CN
|
||
|
||
点击确定后异步关闭 Popconfirm，例如提交表单。
|
||
|
||
## en-US
|
||
|
||
Asynchronously close a popconfirm when the OK button is pressed. For example, you can use this pattern when you submit a form.
|
||
|
||
</docs>
|
||
|
||
<template>
|
||
<a-popconfirm title="Title" @confirm="confirm" @cancel="cancel">
|
||
<a-button type="primary">Open Popconfirm with Promise</a-button>
|
||
</a-popconfirm>
|
||
</template>
|
||
<script lang="ts">
|
||
import { defineComponent } from 'vue';
|
||
import { message } from 'ant-design-vue';
|
||
export default defineComponent({
|
||
setup() {
|
||
const confirm = (e: MouseEvent) => {
|
||
console.log(e);
|
||
return new Promise(resolve => {
|
||
setTimeout(() => resolve(true), 3000);
|
||
});
|
||
};
|
||
|
||
const cancel = (e: MouseEvent) => {
|
||
console.log(e);
|
||
message.error('Click on No');
|
||
};
|
||
return {
|
||
confirm,
|
||
cancel,
|
||
};
|
||
},
|
||
});
|
||
</script>
|