通知Notification

你可能会说

右上角铃铛点开,里面列出所有系统消息。

在页面角落或通知中心出现,提醒用户某件事已经发生或需要处理例如报表导出完成后,通知可以显示“文件已生成”,并提供“下载”入口。只有需要稍后查看的消息才应保留在通知中心;短暂的操作反馈用 轻提示 Toast 更合适。
审核未通过
封面临摹比例过高,请调整后重新提交。
查看原因 →
×

什么时候用

  • 审核 / 审批结果:带原因和「查看详情」入口
    审核未通过 查看原因 →
  • 新评论 / 新@提醒:不是当下操作的直接结果
    新评论「这个方案我觉得可以」查看 →
  • 后台任务完成:导出完成,附下载入口
    导出完成1,024 条数据已导出下载文件 →
  • 系统公告:版本更新、活动通知
    系统公告v2.4 已发布,新增深色模式更新日志 →

什么时候不用

  • “保存成功”等简短结果:使用 轻提示 Toast
    已保存一句话的事,用不着通知
  • 需要立即处理才能继续:使用 弹窗 Modal 限制后续操作
    请先完成实名认证
    去认证
  • 需要持续显示的提醒:使用 警告提示 Alert
    📢 本周六 02:00-04:00 系统维护,期间暂不可用
  • 连续推送多条通知:会遮挡内容并分散注意力
    新评论
    导出完成
    系统公告
组成结构 · Anatomy
审核未通过封面临摹比例过高,请调整后重新提交。
×
在界面角落展示消息的卡片
区分信息 / 成功 / 警告
一句话结论,加粗
原因、影响和下一步入口
让用户按需关闭通知
常见变体 · Variants
基础通知Basic
新评论
「这个方案我觉得可以」
×
有消息值得知道,但不急着处理
带操作链接With Action
导出完成
1,024 条数据已导出
下载文件 →
×
告知之外还要给一个下一步入口
警告类型Warning
存储空间不足
剩余不到 500MB,请及时清理
×
出现需要留意的隐患,如空间不足
典型使用场景
审核结果通知
审核未通过
封面临摹比例过高,请调整后重新提交。
查看原因 →
×
新消息提醒
新评论
林小hu:「这个方案我觉得可以,就按这版做。」
回复 →
×
导出完成下载
导出完成
1,024 条订单数据已打包完成。
下载文件 →
×
版本更新公告
系统公告
v2.4 已发布:新增深色模式与全局搜索。
更新日志 →
×