2018-03-06 14:53:32 +00:00
|
|
|
<cn>
|
|
|
|
#### 确认对话框
|
|
|
|
使用 `confirm()` 可以快捷地弹出确认框。
|
|
|
|
</cn>
|
|
|
|
|
|
|
|
<us>
|
|
|
|
#### Confirmation modal dialog
|
|
|
|
To use `confirm()` to popup a confirmation modal dialog.
|
|
|
|
</us>
|
|
|
|
|
2019-10-09 10:32:23 +00:00
|
|
|
```tpl
|
2018-03-06 14:53:32 +00:00
|
|
|
<template>
|
|
|
|
<div>
|
|
|
|
<a-button @click="showConfirm">
|
|
|
|
Confirm
|
|
|
|
</a-button>
|
|
|
|
<a-button @click="showDeleteConfirm" type="dashed">
|
|
|
|
Delete
|
|
|
|
</a-button>
|
2018-12-09 09:34:27 +00:00
|
|
|
<a-button @click="showPropsConfirm" type="dashed">
|
|
|
|
With extra props
|
|
|
|
</a-button>
|
2018-03-06 14:53:32 +00:00
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<script>
|
2019-09-28 12:45:07 +00:00
|
|
|
export default {
|
|
|
|
methods: {
|
|
|
|
showConfirm() {
|
|
|
|
this.$confirm({
|
|
|
|
title: 'Do you Want to delete these items?',
|
|
|
|
content: h => <div style="color:red;">Some descriptions</div>,
|
|
|
|
onOk() {
|
|
|
|
console.log('OK');
|
|
|
|
},
|
|
|
|
onCancel() {
|
|
|
|
console.log('Cancel');
|
|
|
|
},
|
|
|
|
class: 'test',
|
|
|
|
});
|
|
|
|
},
|
2018-03-06 14:53:32 +00:00
|
|
|
|
2019-09-28 12:45:07 +00:00
|
|
|
showDeleteConfirm() {
|
|
|
|
this.$confirm({
|
|
|
|
title: 'Are you sure delete this task?',
|
|
|
|
content: 'Some descriptions',
|
|
|
|
okText: 'Yes',
|
|
|
|
okType: 'danger',
|
|
|
|
cancelText: 'No',
|
|
|
|
onOk() {
|
|
|
|
console.log('OK');
|
|
|
|
},
|
|
|
|
onCancel() {
|
|
|
|
console.log('Cancel');
|
|
|
|
},
|
|
|
|
});
|
|
|
|
},
|
|
|
|
showPropsConfirm() {
|
|
|
|
this.$confirm({
|
|
|
|
title: 'Are you sure delete this task?',
|
|
|
|
content: 'Some descriptions',
|
|
|
|
okText: 'Yes',
|
|
|
|
okType: 'danger',
|
|
|
|
okButtonProps: {
|
|
|
|
props: { disabled: true },
|
|
|
|
},
|
|
|
|
cancelText: 'No',
|
|
|
|
onOk() {
|
|
|
|
console.log('OK');
|
|
|
|
},
|
|
|
|
onCancel() {
|
|
|
|
console.log('Cancel');
|
|
|
|
},
|
|
|
|
});
|
|
|
|
},
|
2018-03-06 14:53:32 +00:00
|
|
|
},
|
2019-09-28 12:45:07 +00:00
|
|
|
};
|
2018-03-06 14:53:32 +00:00
|
|
|
</script>
|
|
|
|
```
|