网站后台页面是什么,响应式网站多少价格,关键词推广哪家好,中英双语网站怎么做用于页面中展示重要的提示信息。
基础用法#
Alert 组件不属于浮层元素#xff0c;不会自动消失或关闭。 Alert 组件提供四种类型#xff0c;由 type 属性指定#xff0c;默认值为 info。
success alert
info alert
warning alert
error alert 主题#
Alert 组件提供了…用于页面中展示重要的提示信息。
基础用法#
Alert 组件不属于浮层元素不会自动消失或关闭。 Alert 组件提供四种类型由 type 属性指定默认值为 info。
success alert
info alert
warning alert
error alert 主题#
Alert 组件提供了两个不同的主题light 和 dark。 通过设置 effect 属性来改变主题默认为 light。
success alert
info alert
warning alert
error alert 自定义关闭按钮#
你可以自定义关闭按钮为文字或其他符号。 你可以设置 Alert 组件是否为可关闭状态 关闭按钮的内容以及关闭时的回调函数同样可以定制。 closable 属性决定 Alert 组件是否可关闭 该属性接受一个 Boolean默认为 false。 你可以设置 close-text 属性来代替右侧的关闭图标 需要注意的是 close-text 必须是一个字符串。 当 Alert 组件被关闭时会触发 close 事件。
unclosable alert
customized close-text
Gotcha
alert with callback 使用图标#
你可以通过为 Alert 组件添加图标来提高可读性。 通过设置 show-icon 属性来显示 Alert 的 icon这能更有效地向用户展示你的显示意图。 success alert info alert warning alert error alert 文字居中#
使用 center 属性来让文字水平居中。 success alert info alert warning alert error alert 文字描述#
为 Alert 组件添加一个更加详细的描述来使用户了解更多信息。 除了必填的 title 属性外你可以设置 description 属性来帮助你更好地介绍我们称之为辅助性文字。 辅助性文字只能存放文本内容当内容超出长度限制时会自动换行显示。
with description
This is a description. 带图标和描述# 在最后, 这是一个带有图标和描述的例子。
success alert
more text description
info alert
more text description
warning alert
more text description
error alert
more text description Alert API#
Attributes#
名称说明类型默认值titleAlert 标题。string—typeAlert 类型。enuminfodescription描述性文本string—closable是否可以关闭booleantruecenter文字是否居中booleanfalseclose-text自定义关闭按钮文本string—show-icon是否显示类型图标booleanfalseeffect主题样式enumlight
Events#
名称描述类型close关闭 Alert 时触发的事件Function
Slots#
名称描述defaultAlert 内容描述title标题的内容
