Badge
Un número o una marca de estado en botones e iconos.
Uso básico
Muestra la cantidad de mensajes nuevos.
La cantidad se define con un valor que acepta Número o Cadena.
Valor máximo
Puede personalizar el valor máximo.
El valor máximo se define por la propiedad max que es un número. Tenga en cuenta que sólo funciona cuando el valor es también un número.
Personalizaciones
Muestra contenido de texto distinto a los números.
Cuando el valor es una cadena, puede mostrar texto personalizado.
Punto rojo
Usa un punto rojo para marcar contenido que necesita ser notado.
Use el atributo is-dot
. Es booleano.
Offset 2.7.0
Set offset of the badge dot, the format is [left, top], which represents the offset of the status dot from the left and top of the default position.
API
Atributos
Nombre | Descripción | Tipo | Por defecto |
---|---|---|---|
value | valor a mostrar. | string / number | '' |
max | valor máximo, muestra {max}+ cuando se excede. Sólo funciona si el valor es un número. | number | 99 |
is-dot | si se debe mostrar un pequeño punto rojo. | boolean | false |
hidden | oculta el Badge. | boolean | false |
type | tipo de badge. | enum | danger |
show-zero 2.6.0 | Whether to show badge when value is zero. | boolean | true |
color 2.6.3 | background color of the dot | string | |
offset 2.7.0 | offset of badge | [ number , number ] | — |
badge-style 2.7.1 | custom style of badge | object | — |
badge-class 2.7.1 | custom class of badge | string | — |
Slots
Nombre | Descripción |
---|---|
default | personaliza el contenido por defecto |
Fuente
Componentes • Style • Documentación