ant-design-vue/components/modal/demo/info.md

66 lines
1.5 KiB
Markdown
Raw Normal View History

2018-03-07 13:36:15 +00:00
<cn>
#### 信息提示
各种类型的信息提示,只提供一个按钮用于关闭。
</cn>
<us>
#### Information modal dialog
In the various types of information modal dialog, only one button to close dialog is provided.
</us>
2019-10-09 10:32:23 +00:00
```tpl
2018-03-07 13:36:15 +00:00
<template>
<div>
<a-button @click="info">Info</a-button>
<a-button @click="success">Success</a-button>
<a-button @click="error">Error</a-button>
<a-button @click="warning">Warning</a-button>
</div>
</template>
<script>
2019-09-28 12:45:07 +00:00
import { Modal } from 'ant-design-vue';
export default {
methods: {
info() {
const h = this.$createElement;
this.$info({
title: 'This is a notification message',
content: h('div', {}, [
h('p', 'some messages...some messages...'),
h('p', 'some messages...some messages...'),
]),
onOk() {},
});
},
2018-03-07 13:36:15 +00:00
2019-09-28 12:45:07 +00:00
success() {
this.$success({
title: 'This is a success message',
// JSX support
content: (
<div>
<p>some messages...some messages...</p>
<p>some messages...some messages...</p>
</div>
),
});
},
2018-03-07 13:36:15 +00:00
2019-09-28 12:45:07 +00:00
error() {
this.$error({
title: 'This is an error message',
content: 'some messages...some messages...',
});
},
2018-03-07 13:36:15 +00:00
2019-09-28 12:45:07 +00:00
warning() {
this.$warning({
title: 'This is a warning message',
content: 'some messages...some messages...',
});
},
2018-03-07 13:36:15 +00:00
},
2019-09-28 12:45:07 +00:00
};
2018-03-07 13:36:15 +00:00
</script>
```