Skip to content
双端兼容 · 桌面 + 移动

Alert 公告

EwAlert 有两种形态:pill 横幅胶囊用于页面顶部的全站通告(黑色圆形图标块 + 文案 + 动作位), 常规形态为语义色提示卡,用于区块级的状态说明。closable 可关闭。

横幅胶囊

pill 形态
全站通告位:版本发布、活动入口等;action 插槽放跳转链接。
Nimbus 2.0 发布:全新编辑器与团队空间
vue
<EwAlert pill>
  <span>Nimbus 2.0 发布:全新编辑器与团队空间</span>
  <template #action><a href="#">查看</a></template>
</EwAlert>

提示卡

语义色调与关闭
success / warning / danger / neutral 语义色;closable 后隐藏由组件内部管理。
已保存,所有改动即刻同步。
即将废弃 该 API 将在下个大版本移除,请尽快迁移。
vue
<EwAlert tone="success" icon="check">已保存。</EwAlert>
<EwAlert tone="warning" icon="warning" title="即将废弃" closable>…</EwAlert>

API

Props

属性说明类型默认值
title加粗标题string
icon图标名string
tone语义色'primary' | 'success' | 'warning' | 'danger' | 'neutral''primary'
pill横幅胶囊形态booleanfalse
closable可关闭booleanfalse

插槽

插槽说明
icon图标覆写
title标题覆写
default正文内容
action右侧动作位

基于 MIT 许可证发布