Notification 通知

悬浮出现在页面右上角,显示全局的通知提醒消息。

基本用法

适用性广泛的通知栏

Notification 通知 - 图1

带有倾向性

带有 icon,常用来显示「成功、警告、消息、错误」类的系统消息

Notification 通知 - 图2

带有偏移

让 Notification 偏移一些位置

Notification 通知 - 图3

单独引用

单独引入 Notification:

  1. import { Notification } from 'element-react';

此时调用方法为 Notification(options)。我们也为每个 type 定义了各自的方法,如 Notification.success(options)

参数

参数说明类型可选值默认值
title标题string
message说明文字string/ReactElement
type主题样式,如果不在可选值内将被忽略stringsuccess/warning/info/error
iconClass自定义图标的类名。若设置了 type,则 iconClass 会被覆盖string
duration显示时间, 毫秒。设为 0 则不会自动关闭number4500
onClose关闭时的回调函数function
onClick点击 Notification 时的回调函数function
offset偏移的距离,在同一时刻,所有的 Notification 实例应当具有一个相同的偏移量number0

方法

调用 Notification 会返回当前 Notification 的实例。如果需要手动关闭实例,可以调用它的 close 方法。

方法名说明
close关闭当前的 Notification