Notification 通知框
用于全局通知,悬浮在页面角落。
Notification.open
打开一个默认通知。Notification.info
打开一个信息通知。Notification.success
打开一个表示成功信息的通知。Notification.warning
打开一个表示警告信息的通知。Notification.error
打开一个表示错误信息的通知。Notification.close
关闭一个通知。Notification.closeAll
关闭所有通知。
获取组件
import { Notification } from 'rsuite';
演示
默认
通知类型
位置
自定义
关闭
延迟关闭
duration 是一个可选项,当设置为 0 时,则不自动关闭。
Methods
Notification.open
Notification.open(props: NotificationProps);
Notification.info
Notification.info(props: NotificationProps);
Notification.success
Notification.success(props: NotificationProps);
Notification.warning
Notification.warning(props: NotificationProps);
Notification.error
Notification.error(props: NotificationProps);
Notification.close
Notification.close(key?: string);
Notification.closeAll
Notification.closeAll();
Types
interface NotificationProps {
title: React.ReactNode;
description: React.ReactNode;
duration?: number;
placement?: string;
className?: string;
style?: React.CSSProperties;
top?: number;
bottom?: number;
key?: string;
onClose?: () => void;
}
属性名称 | 类型 (默认值) |
描述 |
---|---|---|
bottom | number (24) |
消息框距离底部的距离 |
description * | React.Node | 描述 |
duration | number (4500) |
消息框持续时间 (单位:毫秒) |
key | string | 消息框唯一标识,如果要手动移除消息框,必须填写该字段 |
onClose | () => void | 关闭回调函数 |
placement | enum: NotificationPlacement('topEnd') |
消息框的位置 |
style | React.CSSProperties | 自定义样式 |
title * | string | 标题 |
top | number (24) |
消息框距离顶部的距离 |