SuperAPI AI 工具集

el-alert

通用与其它

查看项目

更新于 10-15 23:32

技能介绍

用途:el-alert 是 Element Plus 提供的警告组件,用于在页面上展示重要提示信息。与通知类组件不同,警告是非浮层元素,不会自动消失,适合展示系统消息、警告、操作结果或需要用户注意的状态信息。

主要能力:支持 title(必填标题)、type(primary/success/warning/info/error,默认 info)、description(描述文本)、closable(是否可关闭,默认 true)、center(内容居中)、close-text(自定义关闭按钮文字)、show-icon(显示类型图标)、effect(light/dark 主题,默认 light)。提供 close 事件,以及 default、title、icon 三个插槽,可自定义描述、标题与图标内容。

使用方式:在模板中直接使用 <el-alert> 标签并传入属性,例如 <el-alert title="success alert" type="success" />。可通过 :closable="false" 禁止关闭,通过 close-text 自定义关闭文字,通过 @close 绑定关闭回调。图标可用 show-icon 启用默认图标,或用 #icon 插槽替换。动态场景可结合 Vue 的 ref/reactive 修改 type、title、description;自动消失可配合 v-if 与 setTimeout 控制显示状态。

适用场景:表单校验结果提示、操作成功或失败反馈、系统警告、非浮层状态信息展示,也可与 Message、Notification、Dialog 等组件配合区分临时通知与持久提示。

限制:资料未提供该技能的安装命令、依赖版本、收费方式或平台信息,暂未提供。使用时需注意 title 为必填项,且警告不会自动消失,如需自动关闭需自行实现逻辑。