使用通知向用户传达醒目的消息。
设计指南
通知显示简洁的消息。它还可以为用户提供选项，例如查看已发布的帖子或更新设置，并且需要用户采取行动才能关闭。
使用通知来传达重要的但不一定需要采取行动的内容——即使用户不选择对通知采取行动，他们也可以继续使用产品。它们比模态框的干扰性更小。
用法
通知显示在屏幕顶部，位于任何固定在页面上方的工具栏下方。它们是持久且非模态的。由于它们不会覆盖内容，用户可以忽略或关闭它们，并选择何时与之交互。
通知采用颜色编码以指示正在传达的消息类型：
- 信息性通知默认情况下为蓝色。
- 成功通知为绿色。
- 警告通知为黄色。
- 错误通知为红色。
如果通知中包含图标，则图标应采用颜色编码以匹配通知状态。
宜与忌
宜当您想要传达中等重要性的消息时，使用通知。
忌不要将通知用于需要用户立即注意和行动的消息。请改用模态框。
宜将通知显示在屏幕顶部，位于任何工具栏下方。
忌不要在工具栏上方显示通知。
宜使用颜色来指示正在传达的消息类型。
忌不要应用警告、成功或错误之外的任何颜色。
开发指南
用法
要显示纯文本通知，请将字符串传递给 Notice：
import { Notice } from '@wordpress/components';
const MyNotice = () => (
<Notice status="error">An unknown error occurred.</Notice>
);
对于更复杂的标记，您可以传递任何 JSX 元素：
import { Notice } from '@wordpress/components';
const MyNotice = () => (
<Notice status="error">
<p>
An error occurred: <code>{ errorDetails }</code>.
</p>
</Notice>
);
属性
以下属性用于控制组件的行为。
children: ReactNode
通知显示的文本。除非提供 spokenMessage 作为替代消息，否则也用作辅助技术的朗读消息。
- 必填：是
spokenMessage: ReactNode
用于提供自定义朗读消息，以代替 children 默认值。
- 必填：否
- 默认值：
children
status: ‘warning’ | ‘success’ | ‘error’ | ‘info’
确定通知的颜色：warning（黄色）、success（绿色）、error（红色）或 'info'。默认情况下 'info' 将为蓝色。
- 必填：否
- 默认值：
info
onRemove: () => void
用于关闭/移除通知的函数。
- 必填：否
- 默认值：
noop
politeness: ‘polite’ | ‘assertive’
通知朗读消息的礼貌级别。应作为 aria-live 属性值的有效选项之一 提供。
'assertive'的值应用于重要且通常具有时间敏感性的信息。它将中断屏幕阅读器当前正在播报的任何其他内容。'polite'的值应用于建议性信息。它不应中断屏幕阅读器当前正在播报的内容（“语音队列”）或中断当前任务。
请注意，此值应被视为建议；辅助技术可能会根据内部启发式方法覆盖它。
- 必填：否
- 默认值：
'assertive'或'polite'，取决于通知状态。
isDismissible: boolean
通知是否可关闭
- 必填：否
- 默认值：
true
onDismiss : () => void
onRemove 的已弃用替代方案。保留此属性是为了兼容性原因，但应避免使用。
- 必填：否
- 默认值：
noop
actions: Array<NoticeAction>.
通知操作数组。每个成员对象应包含：
label：string包含按钮/链接的文本url：string（可选）操作按钮的 href URL。如果提供，操作将呈现为锚标签。onClick：( event: SyntheticEvent ) => void（可选）点击时调用的函数。可与url一起使用。disabled：boolean（可选）操作按钮是否被禁用。className：string（可选）用于向按钮样式添加自定义类。noDefaultClasses：boolean（可选）值为true将移除所有默认样式。variant：'primary' | 'secondary' | 'link'（可选）您可以通过传递primary值来表示通知的主要按钮操作。
如果仅提供 onClick，则操作按钮的默认 variant 为 'secondary'；如果提供 url，则为 'link'。
相关组件
- 若要创建需要行动的更醒目的消息，请使用模态框。
- 对于低优先级、非中断性的消息，请使用 Snackbar。