Skip to content

nve-menu

En meny som tilbyr en liste av valg. Valgene lager du med en eller flere nve-menu-item's. Du kan også bruke nve-label inni nve-menu, for eksempel til å kategorisere menyvalg. Nve-label får en spesiell styling når den brukes inni nve-menu For å skille skille valg fra hverandre, kan du bruke nve-divider.

Arvet fra SlMenu.

Denne komponenten bygger på en Shoelace-komponent. Sjekk også dokumentasjonen i Shoelace for å få full oversikt over hvordan komponenten funker.

Feil / oppgaver / PR

Ingen som vi vet om. Hvis du finner noe muffens, registrer en feil under Issues i Github og merk den med nve-menu.

 

html
<nve-menu>
  <nve-menu-item>Hummer</nve-menu-item>
  <nve-menu-item>Kanari</nve-menu-item>
</nve-menu>

Eksempler

Se nve-menu-item for mer info om menyvalg. Se nve-divider for eksempel på hvordan du skiller menyvalg. Se nve-dropdown for eksempel på hvordan du lager en drop-down-meny.

Under-menyer

Du kan lage en under-meny ved å legge en nve-menu slot="submenu" inni nve-menu-item.

html
<nve-menu>
  <nve-menu-item>Hummer</nve-menu-item>
  <nve-menu-item
    >Kanari
    <nve-menu slot="submenu">
      <nve-menu-item>Liten</nve-menu-item>
      <nve-menu-item>Stor</nve-menu-item>
    </nve-menu>
  </nve-menu-item>
</nve-menu>

Spor

NavnBeskrivelse
(standard)The menu's content, including menu items, menu labels, and dividers.

Hendelser

NavnArvet fraBeskrivelse
sl-selectSlMenuEmitted when a menu item is selected.

Egenskaper

NavnTypeArvet fraBeskrivelseReflected
defaultSlotHTMLSlotElement SlMenu