Menüs

Menüs

Split-Buttons

Ein Button, der eine Aktion ausführt und weitere Optionen bietet: Der Hauptteil führt die Aktion aus, das am Ende befestigte Caret — und nur das Caret — öffnet das Menü. `button_menu` erhält eine `action` — `{ href }` oder `{ type: 'submit' }` in einem Formular; der vue Button gibt `action` aus.

Separatoren

Ein Separator ist ein Element wie die anderen, mit einem Schlüssel mehr: Eine einfache Linie trennt zwei Gruppen von Elementen, die nichts miteinander zu tun haben, und die gleiche Linie, die ein Wort erhält, wird zur Überschrift des Folgenden. Beide Seiten des Stapels lesen dieselbe Erklärung – das dritte Menü hier ist das Vue-Menü.

Zählungen

Wie viele von dem, worauf das Element führt, am anderen Ende der Zeile. Es ist eine Pillenanzeige und sonst nichts – übergebe `count` neben dem Label, in einem Dropdown-Element oder einem vertikalen Menüelement, und das Element platziert es. Ein Element ohne den Schlüssel zeigt nichts an.

Was ein Element sein kann

Vier Arten teilen sich eine Zeile: Ein Wort und ein Ziel ist ein Link, ein Wort und ein Zustand ist ein Umschalter, ein Wort und Kinder ist ein Zweig, und eine einfache Linie ist ein Separator. Nichts erklärt seine Art – es folgt aus dem, was das Element trägt. Ein Umschalter verwendet seinen führenden Slot für sein Zeichen, sodass eine Spalte davon ihre Wörter ausgerichtet hält und das Panel darunter offen bleibt: Ein Menü von Filtern wird in der Menge gelesen, nicht eins nach dem anderen.

Menüschaltflächen

Vue

Die Linkzeile und der Separator als Vue-Teile. Im Gegensatz zu den Zeilen, die eine Route lesen, nehmen diese beiden ihr Icon und Label als Optionen, sodass nichts vom Server fehlt.