The v-btn-toggle
component is a simple wrapper for v-item-group
built specifically to work with v-btn
.
Toggle buttons allow you to create a styled group of buttons that can selected or toggled under a single v-model
Wählen Sie unten Ihren gewünschte Komponente aus und sehen Sie die verfügbaren Attribute, Slots, Ereignisse und Funktionen.
Die active-class wurde bei der Aktivierung auf Kinder angewendet.
Changes the background-color for the component.
Removes the group's border.
Wendet eine bestimmte Farbe für die Steuerung an - es kann der Name der Materialfarbe sein (zum Beispiel success
oder purple
) oder css-Farben (#033
oder rgba(255, 0, 0, 0.5)
). Sie finden eine Liste der eingebauten Klassen auf der Farbseite.
Wendet die dunkle Theme-Variante für die Komponente an. Mehr Informationen zur Material Design Dokumentation für dunkle Themes.
Reduces the button size and padding.
Wendet die helle Theme-Variante für die Komponente an.
Erzwingt einen Wert immer ausgewählt zu sein (falls verfügbar).
Legt eine maximale Anzahl von Auswahlen fest, die getroffen werden können.
Erlaube mehrere Auswahlen. Der value-Props muss ein Array sein.
Round edge buttons
Erstellt einen großen runden Rand oben links und unten rechts auf die Karte.
Components.Sheets.props.tile
Der angegebene model-wert für den Component.
Der Standard-Vue Slot.
Emitted when the input is changed by user interaction
any[] | any
$border-radius-root !default;
48px !default;
0.8 !default;
0 12px !default;
48px !default;
0 8px !default;
4px !default;
24px !default;
24px !default;
Unten finden Sie eine Sammlung einfacher bis komplexer Beispiele.
You can make VBtnToggle
rounded using the rounded
prop.
mandatory
VBtnToggle
always has value.
multiple
VBtnToggle
allows user to select multiple variants and returns value as an array.
Easily integrate customized button solutions with a v-toolbar
Group similar actions and design your own WYSIWYG component.
Bereit für mehr? Weiter lesen mit: