代码演示
如何引入
基本用法
不同类型
支持4种类型：
info、warning、danger、success。默认为 info。非全屏模式
可以设置
fullMode={false} 使用非全屏模式的 banner 样式。
通过 bordered 属性可以设置边框。自定义内容
可以通过 children 自定义其他渲染内容。
API参考
| 属性 | 说明 | 类型 | 默认值 | 版本 |
|---|---|---|---|---|
| bordered | 是否展示边框，仅在非全屏模式下有效 | boolean | false | 1.0 |
| className | 类名 | string | - | - |
| closeIcon | 自定义关闭icon，为 null 时不显示关闭按钮 | string| ReactNode | - | 1.0 |
| description | 描述内容 | ReactNode | - | 1.0 |
| fullMode | 是否为全屏模式 | boolean | true | 1.0 |
| icon | 自定义 icon，为 null 时不显示 icon | string| ReactNode | - | 1.0 |
| onClose | 关闭时的回调函数 | function | - | - |
| style | 样式名 | object | - | - |
| title | 标题 | ReactNode | - | 1.0 |
| type | 类型，支持 info, success, danger, warning | string | info | - |
Accessibility
ARIA
- 组件的
role为 'alert' - 关闭按钮的
aria-label为 'Close'
键盘和焦点
- Banner 的关闭按钮可以使用
Tab键聚焦，按钮聚焦后，敲击Enter键或Space键可以关闭 banner
