轻提示 Toast
操作后的短暂反馈：保存成功、复制成功、上传失败。显示在页面顶部居中（页头下方），3.5 秒后自动消失。
examples/toast/basic.html
调用方式
js
CbtisUI.toast.show('已复制申请编号')
CbtisUI.toast.success('资料已保存')
CbtisUI.toast.error('上传失败，请重试', { duration: 6000 })
// ES Module
import { toast } from '@cbtis/design-system/js'| 参数 | 默认值 | 说明 |
|---|---|---|
duration | 3500 | 毫秒；0 表示不自动消失 |
closeLabel | 关闭 | 关闭按钮的读屏文案，英文页面传 Close |
纯 HTML 触发：<button data-cb-toast="已复制" data-cb-toast-tone="success">。
使用建议
推荐
- 文案一句话，结果在前：「资料已保存」而不是「您的资料我们已经为您保存成功」
- 错误提示附带原因或解决办法，并适当延长显示时间
避免
- 用 Toast 显示需要用户处理的信息（例如表单校验错误），用户可能来不及看
- 同时弹出多条相同内容
无障碍
- 容器是
aria-live="polite"区域；错误提示使用role="alert"立即播报 - 所有提示都带关闭按钮，不依赖计时器
与 v2 的差异
| v2 现状 | 规范 |
|---|---|
| 成功图标用品牌蓝 | 使用 success 色 |
关闭按钮 aria-label="close" 写死英文 | 通过 closeLabel 传入 |