SepAlert 警告提示组件 v1.3.0

页面内持久化提示 · type 四态 / title / description / closable / closeText / showIcon / center / effect(light/dark/plain) / banner / action / visible 受控 / icon 自定义图标 / closeIcon 自定义关闭 / afterClose / onClick / copyable 可复制 / collapsible 折叠

1. 基础用法(四种 type)

HTML 声明式标签
JS API 初始化

2. 带描述 description

HTML 声明式标签
JS API 初始化

3. 可关闭 closable

HTML 声明式标签
JS API 初始化

4. 自定义关闭文字 closeText

HTML 声明式标签
JS API 初始化

5. 显示图标 showIcon

HTML 声明式标签
JS API 初始化

6. 文字居中 center

HTML 声明式标签
JS API 初始化

7. effect 浅/深主题

HTML 声明式标签
JS API 初始化

7b. effect=plain 素色模式

HTML 声明式标签 · 背景透明仅左侧竖条着色(Element Plus 风格页面内联提示)
JS API 初始化

8. banner 公告模式

HTML 声明式标签
JS API 初始化

9. action 操作区

JS API 初始化(HTML 声明式建议使用插槽)

10. visible 受控显隐

JS API:点击按钮控制显示/隐藏
切换显示 visible=true

11. icon 自定义图标

用 icon 替换默认状态图标(支持 HTML 字符串 / DOM 元素 / 函数)

12. closeIcon 自定义关闭图标

用 closeIcon 替换默认 ×(closeText 优先级高于 closeIcon)

13. afterClose 关闭动画回调

onClose 点击时触发 · afterClose 动画结束后触发
重新打开 状态:待关闭

14b. onClick 主体点击

HTML 声明式标签 · 点击 Alert 主体跳转/展开详情
JS API 初始化
未点击

14c. copyable 可复制

HTML 声明式标签
JS API 初始化

14d. collapsible 折叠展开

HTML 声明式标签
JS API 初始化 — toggleDesc() 动态控制
切换折叠 展开中

14. 综合场景:表单校验错误汇总

bordered 风格的错误汇总,带图标+描述+操作按钮+可关闭

15. 自动化断言