VBadge API
组件页面
属性
| 名称 | 类型 | 默认值 |
|---|---|---|
| bordered | ||
| 当使用 dot 属性时，默认情况下会在徽章上应用一个 2px 和它的周围应用一个 1.5px 的边框。 | ||
| 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 . | ||
| content | ||
| Text content to show in the badge. | ||
| dot | ||
| Reduce the size of the badge and hide its contents. | ||
| floating | ||
| Elevates the badge above the slotted content. | ||
| icon | ||
| 为按钮指定一个 v-icon 图标。 | ||
| inline | ||
| 移动徽章，使其与包装元素保持一致。支持使用 left prop。 | ||
| label | ||
| The aria-label used for the badge. | ||
| location | ||
| Specifies the component’s location. Can combine by using a space separated string. | ||
| max | ||
| Sets the maximum number allowed when using the content prop with a number like value. If the content number exceeds the maximum value, a + suffix is added. | ||
| model-value | ||
| 组件 v-mode 的值。如果组件支持多属性，默认为空数组。 | ||
| offset-x | ||
| 将徽章在 x 轴上偏移。 | ||
| offset-y | ||
| 将徽章在 y 轴上偏移。 | ||
| 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-color | ||
| Applies a specified color to the control text - 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 . | ||
| theme | ||
| Specify a theme for this component and all of its children. | ||
| tile | ||
| Removes any applied border-radius from the component. | ||
| transition | ||
| Sets the component transition. Can be one of the built in or custom transition. | ||
插槽
| badge |
| 用于标记内容的插槽。 |
| default |
| 默认Vue 插槽。 |
SASS 变量
| 名称 | 默认值 |
|---|---|
| $badge-background | |
| $badge-border-color | |
| $badge-border-radius | |
| $badge-border-style | |
| $badge-border-transform | |
| $badge-border-width | |
| $badge-color | |
| $badge-dot-border-radius | |
| $badge-dot-border-width | |
| $badge-dot-height | |
| $badge-dot-width | |
| $badge-font-family | |
| $badge-font-size | |
| $badge-font-weight | |
| $badge-height | |
| $badge-icon-margin | |
| $badge-icon-padding | |
| $badge-inline-vertical-align | |
| $badge-line-height | |
| $badge-min-width | |
| $badge-padding | |
| $badge-theme | |
| $badge-transition | |
| $badge-wrapper-margin | |