设计
设计指南
设计原则
样式指南
设计资源
Klein - Figma
Klein Font
官方图标库
开发
开发文档
React
Vue Web
敬请期待
开发资源
GitHub 代码仓库
生态产品
生态产品
Orion Fonts
敬请期待
Orio Market
敬请期待
Klein Pro
敬请期待
Klein Editor
敬请期待
警告提示 Alert
用于页面中展示重要的提示信息、当某个页面需要向用户显示警告的信息时。
非浮层的静态展现形式,始终展现,不会自动消失,用户可以点击关闭。
基本用法
自定义消息格式
自定义关闭按钮
显示图标
提示辅助内容
操作按钮
Alert Props
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
type | 警告提示的样式,支持四种样式 | "success" | info |
message | 警告提示内容 | ReactNode | - |
description | 警告提示辅助内容 | ReactNode | - |
closable | 是否显示关闭按钮 | boolean | false |
closeText | 自定义关闭按钮 | ReactNode | - |
showIcon | 是否显示 icon | boolean | false |
icon | 自定义图标,showIcon 为 true 时有效 | ReactNode | - |
action | 操作按钮 | ReactNode | - |
className | 自定义 className | string | - |
style | 自定义 style | CSSProperties | - |
onClose | 关闭时的回调函数 | ((event: MouseEvent<Element, MouseEvent>) => void) | - |