ant-design/components/notification/demo/with-icon.md

41 lines
950 B
Markdown
Raw Normal View History

2016-03-31 09:40:55 +08:00
---
order: 2
title:
zh-CN: 带有图标的通知提醒框
en-US: Notification with icon
2016-03-31 09:40:55 +08:00
---
2015-07-28 15:40:28 +08:00
2016-08-17 11:07:02 +08:00
## zh-CN
2015-08-06 15:19:45 +08:00
通知提醒框左侧有图标。
2015-07-28 15:40:28 +08:00
2016-08-17 11:07:02 +08:00
## en-US
A notification box with a icon at the left side.
2017-01-19 15:19:03 +08:00
````__react
import { Button, notification } from 'antd';
2015-07-28 15:40:28 +08:00
2016-12-14 17:57:15 +08:00
const openNotificationWithIcon = (type) => {
notification[type]({
message: 'Notification Title',
description: 'This is the content of the notification. This is the content of the notification. This is the content of the notification.',
2016-12-14 17:57:15 +08:00
});
};
2015-08-03 15:17:12 +08:00
ReactDOM.render(
<div>
2016-12-14 17:57:15 +08:00
<Button onClick={() => openNotificationWithIcon('success')}>Success</Button>
<Button onClick={() => openNotificationWithIcon('info')}>Info</Button>
<Button onClick={() => openNotificationWithIcon('warning')}>Warning</Button>
<Button onClick={() => openNotificationWithIcon('error')}>Error</Button>
2015-08-03 15:17:12 +08:00
</div>
, mountNode);
2015-08-04 15:48:00 +08:00
````
<style>
.code-box-demo .ant-btn {
margin-right: 1em;
}
</style>