ant-design/components/notification/index.zh-CN.md
陈帅 785c132262
meger feature to master (#16421)
* use ul in list

* update snapshot

* update comment

* feat: TreeSelect support `showSearch` in multiple mode (#15933)

* update rc-tree-select

* typo

* update desc & snapshot

* update desc & snapshot

* check default showSearch

* feat: table customizing variable (#15971)

* feat: added table selected row color variable

* fix: @table-selected-row-color default is inherit

* feat: Upload support customize previewFile (#15984)

* support preview file

* use promise

* dealy load

* use canvas of render

* use domHook of test

* update demo

* add snapshot

* update types

* update testcase

* feat: form customizing variables (#15954)

* fix: added styling form input background-color

* feat: added '@form-warning-input-bg' variable

* feat: added '@form-error-input-bg' variable

* use li wrap with comment

* feat: Support append theme less file with less-variable (#16118)

* add override

* add override support

* update doc

* feat: dropdown support set right icon

* docs: update doc of dropdown component

* style: format dropdown-button.md

* test: update updateSnapshot

* style: format dropdown-button.md

* test: update updateSnapshot

* test: update updateSnapshot

* style: change style of dropdown-button demo

* fix: fix document table order

* feat: Support SkeletonAvatarProps.size accept number (#16078) (#16128)

* chore:update style of demo

* feat: Notification functions accept top, bottom and getContainer as arguments

* drawer: add afterVisibleChange

* rm onVisibleChange

* update

* feat: 🇭🇷 hr_HR locale (#16258)

* Added Croatian locale

* fixed lint error

*  Add test cases for hr_HR

* 📝 update i18n documentation

* feat:  add `htmlFor` in Form.Item (#16278)

* add htmlFor in Form.Item

* update doc

* feat: Button support `link` type (#16289)

close #15892

* feat: Add Timeline.Item.position (#16148) (#16193)

* fix: Timeline.pendingDot interface documentation there is a small problem (#16177)

* feat: Add Timeline.Item.position (#16148)

* doc: add version infomation for Timeline.Item.position

* refactor: Update Tree & TreeSelect deps (#16330)

* use CSSMotion

* update snapshot

* feat: Collapse support `expandIconPosition` (#16365)

* update doc

* support expandIconPosition

* update snapshot

* feat: Breadcrumb  support DropDown (#16315)

* breadcrumbs support drop down menu

* update doc

* add require less

* fix test

* fix md doc

* less code

* fix  style warning

* update snap

* add children render test

* feat: TreeNode support checkable

* feat: add optional to support top and left slick dots (#16186) (#16225)

* add optional to support top and left slick dots

* update carousel snapshot

* Update doc, add placement demo

* update carousel placement demo snapshots

* rename dots placement to position

* update vertical as deprecated

* rename dotsPosition to dotPosition

* refine code

* add warning testcase for vertical

* remove unused warning

* update expression

* Additional test case for dotPosition

* refactor: Upgrade `rc-tree-select` to support pure React motion (#16402)

* upgrade `rc-tree-select`

* update snapshot

* 3.17.0 changelog

* fix warning

* fix review warning
2019-05-06 12:04:39 +08:00

2.5 KiB

category type noinstant title subtitle
Components 反馈 true Notification 通知提醒框

全局展示通知提醒信息。

何时使用

在系统四个角显示通知提醒信息。经常用于以下情况:

  • 较为复杂的通知内容。
  • 带有交互的通知,给出用户下一步的行动点。
  • 系统主动推送。

API

  • notification.success(config)
  • notification.error(config)
  • notification.info(config)
  • notification.warning(config)
  • notification.warn(config)
  • notification.open(config)
  • notification.close(key: String)
  • notification.destroy()

config 参数如下:

参数 说明 类型 默认值
btn 自定义关闭按钮 ReactNode -
bottom 消息从底部弹出时,距离底部的位置,单位像素。 number 24
className 自定义 CSS class string -
description 通知提醒内容,必选 string|ReactNode -
duration 默认 4.5 秒后自动关闭,配置为 null 则不自动关闭 number 4.5
getContainer 配置渲染节点的输出位置 () => HTMLNode () => document.body
icon 自定义图标 ReactNode -
key 当前通知唯一标志 string -
message 通知提醒标题,必选 string|ReactNode -
onClose 点击默认关闭按钮时触发的回调函数 Function -
onClick 点击通知时触发的回调函数 Function -
placement 弹出位置,可选 topLeft topRight bottomLeft bottomRight string topRight
style 自定义内联样式 React.CSSProperties -
top 消息从顶部弹出时,距离顶部的位置,单位像素。 number 24

还提供了一个全局配置方法,在调用前提前配置,全局一次生效。

  • notification.config(options)
notification.config({
  placement: 'bottomRight',
  bottom: 50,
  duration: 3,
});
参数 说明 类型 默认值
bottom 消息从底部弹出时,距离底部的位置,单位像素。 number 24
duration 默认自动关闭延时,单位秒 number 4.5
getContainer 配置渲染节点的输出位置 () => HTMLNode () => document.body
placement 弹出位置,可选 topLeft topRight bottomLeft bottomRight string topRight
top 消息从顶部弹出时,距离顶部的位置,单位像素。 number 24