Alert 警告

2026-06-27 08:10:31

Alert 警告

Alert 警告用于页面中展示重要的提示信息。

基本用法页面中的非浮层元素,不会自动消失。

成功提示的文案消息提示的文案警告提示的文案错误提示的文案Alert 组件提供四种主题,由type属性指定,默认值为info。

代码语言:javascript代码运行次数:0复制自定义关闭按钮自定义关闭按钮为文字或其他符号。

不可关闭的 alert自定义 close-text知道了设置了回调的 alert在 Alert 组件中,你可以设置是否可关闭,关闭按钮的文本以及关闭时的回调函数。closable属性决定是否可关闭,接受boolean,默认为true。你可以设置close-text属性来代替右侧的关闭图标,注意:close-text必须为文本。设置close事件来设置关闭时的回调。

代码语言:javascript代码运行次数:0复制

带有 icon表示某种状态时提升可读性。

成功提示的文案消息提示的文案警告提示的文案错误提示的文案通过设置show-icon属性来显示 Alert 的 icon,这能更有效地向用户展示你的显示意图。

代码语言:javascript代码运行次数:0复制文字居中使用 center 属性让文字水平居中。

成功提示的文案消息提示的文案警告提示的文案错误提示的文案代码语言:javascript代码运行次数:0复制带有辅助性文字介绍包含标题和内容,解释更详细的警告。

带辅助性文字介绍这是一句绕口令:黑灰化肥会挥发发灰黑化肥挥发;灰黑化肥会挥发发黑灰化肥发挥。 黑灰化肥会挥发发灰黑化肥黑灰挥发化为灰……除了必填的title属性外,你可以设置description属性来帮助你更好地介绍,我们称之为辅助性文字。辅助性文字只能存放单行文本,会自动换行显示。

代码语言:javascript代码运行次数:0复制带有 icon 和辅助性文字介绍

最后,这是一个同时具有 icon 和辅助性文字的样例。

代码语言:javascript代码运行次数:0复制Attributes参数

说明

类型

可选值

默认值

title

标题,必选参数

string

type

主题

string

success/warning/info/error

info

description

辅助性文字。也可通过默认 slot 传入

string

closable

是否可关闭

boolean

true

center

文字是否居中

boolean

true

close-text

关闭按钮自定义文本

string

show-icon

是否显示图标

boolean

false

Events事件名称

说明

回调参数

close

关闭alert时触发的事件

最新发表
友情链接

Copyright © 2022 日本世界杯_林高远世界杯 - edenyn.com All Rights Reserved.