VAlert API
组件页面
属性
| 名称 | 类型 | 默认值 |
|---|---|---|
| border | ||
| Adds a colored border to the component. | ||
| border-color | ||
| 指定边框的颜色，接受任何颜色值。 | ||
| closable | ||
| 添加一个可以关闭警报的图标。 | ||
| close-icon | ||
| 修改用于closable 提醒的默认图标。 | ||
| close-label | ||
| 在 closable 提醒上的 aria-label 使用的文本。也可以在 Internationalization 中进行全局定制化。 | ||
| color | ||
| Applies specified color to the control - supports utility colors (for example success or purple) or css color (#033 or rgba(255, 0, 0, 0.5)). Find a list of built-in classes on the colors page . | ||
| density | ||
| 调整组件使用的垂直高度。 | ||
| elevation | ||
| 组件的海拔可接受 0 到 24 之间的值。你可以在 elevation page 浏览更多信息。 | ||
| height | ||
| 设定组件的高度。 | ||
| icon | ||
| 为按钮指定一个 v-icon 图标。 | ||
| location | ||
| Specifies the component’s location. Can combine by using a space separated string. | ||
| max-height | ||
| 设定组件的最大高度。 | ||
| max-width | ||
| 设定组件的最大宽度。 | ||
| min-height | ||
| 设定组件的最小高度。 | ||
| min-width | ||
| 设定组件的最小宽度。 | ||
| model-value | ||
| 控制组件可见还是隐藏。 | ||
| position | ||
| 设定组件的 position 属性。 | ||
| prominent | ||
| 显示较大的垂直居中图标，以引起更多注意。 | ||
| rounded | ||
| Designates the border-radius applied to the component. This can be 0, xs, sm, true, lg, xl, pill, circle, and shaped. Find more information on available border radius classes on the Border Radius page . | ||
| tag | ||
| 指定在根元素上使用的自定义标签。 | ||
| text | ||
| 设置组件的内容文本。 | ||
| theme | ||
| Specify a theme for this component and all of its children. | ||
| tile | ||
| 删除组件的 border-radius。 | ||
| title | ||
| Specify a title text for the component. | ||
| type | ||
| Create a specialized alert that uses a contextual color and has a pre-defined icon. | ||
| variant | ||
| Applies a distinct style to the component. | ||
| width | ||
| 设定组件的宽度。 | ||
事件
| 名称 | 类型 |
|---|---|
| click:close | |
| Emitted when close icon is clicked. | |
| update:modelValue | |
| 当组件的 model-value 更改时引发的事件。 | |
插槽
| append |
| 提示框末尾的图标插槽。 |
| close |
| dismissible 属性中的图标插槽 |
| default |
| 默认Vue 插槽。 |
| prepend |
| 提示框开始的图标插槽。 |
| text |
| Slot for the component’s text content. |
| title |
| Slot for the component’s title content. |
SASS 变量
| 名称 | 默认值 |
|---|---|
| $alert-append-close-margin-inline-start | |
| $alert-append-margin-inline-start | |
| $alert-background | |
| $alert-border | |
| $alert-border-color | |
| $alert-border-opacity | |
| $alert-border-radius | |
| $alert-border-style | |
| $alert-border-thin-width | |
| $alert-border-width | |
| $alert-color | |
| $alert-density | |
| $alert-elevation | |
| $alert-padding | |
| $alert-plain-opacity | |
| $alert-plain-transition | |
| $alert-positions | |
| $alert-prepend-margin-inline-end | |
| $alert-text-line-height | |
| $alert-title-font-size | |
| $alert-title-font-weight | |
| $alert-title-hyphens | |
| $alert-title-letter-spacing | |
| $alert-title-line-height | |
| $alert-title-overflow-wrap | |
| $alert-title-text-transform | |
| $alert-title-word-break | |
| $alert-title-word-wrap | |
| $alert-variants | |