React Suite 通知组件

React Suite是一个React UI库，其中包括了许多常用的UI组件，通知组件便是其中之一。

安装

使用npm进行安装：

npm install rsuite --save

引入

import { Notification } from 'rsuite';

组件的用法

基础用法

Notification.open({
  title: '标题',
  description: '描述',
});

带有图标的通知

Notification.open({
  title: '标题',
  description: '描述',
  icon: <Icon icon="check-circle" size="2x" />,
});

自动关闭的通知

Notification.open({
  title: '标题',
  description: '描述',
  duration: 5000,
});

自定义样式的通知

Notification.open({
  title: '标题',
  description: '描述',
  style: { background: 'red', color: 'white' },
});

关闭所有通知

Notification.closeAll();

API

Notification.open(props: Object): void

打开一个通知。props可以包含以下属性：

| 属性名 | 类型 | 说明 | | ------------------- | ----------------- | -----------------| | title | String/React.Node | 标题 | | description | String/React.Node | 描述 | | type | String | 类型 | | icon | React.Node | 图标 | | closable | Boolean | 是否可关闭 | | onClose | Function | 关闭回调 | | duration | Number | 自动关闭的时间(ms)| | style | Object | 样式 |

Notification.close(key: String): void

关闭一个已经打开的通知。

Notification.closeAll(): void

关闭所有打开的通知。