ant-design-vue/components/alert/demo/index.vue

60 lines
1.4 KiB
Vue

<script>
import Banner from './banner'
import Basic from './basic'
import Closable from './closable'
import CloseText from './close-text'
import Description from './description'
import Icon from './icon'
import Style from './style'
import SmoothClosed from './smooth-closed'
import CN from '../index.zh-CN.md'
import US from '../index.en-US.md'
const md = {
cn: `# Alert 警告提示
警告提示,展现需要关注的信息。
## 何时使用
- 当某个页面需要向用户显示警告的信息时。
- 非浮层的静态展现形式,始终展现,不会自动消失,用户可以点击关闭。
## 代码演示`,
us: `# Alert
Alert component for feedback.
## When To Use
- When you need to show alert messages to users.
- When you need a persistent static container which is closable by user actions.
## Examples
`,
}
export default {
category: 'Components',
subtitle: '警告提示',
type: 'Feedback',
zhType: '反馈',
title: 'Alert',
render () {
return (
<div id='components-alert-demo'>
<md cn={md.cn} us={md.us}/>
<Banner/>
<Basic/>
<Closable/>
<CloseText/>
<Description/>
<Icon/>
<Style/>
<SmoothClosed/>
<api>
<CN slot='cn' />
<US/>
</api>
</div>
)
},
}
</script>
<style>
#components-alert-demo .ant-alert {
margin-bottom: 16px;
}
</style>