Tilbake til alle komponenter

Select (beta)

BETA_Select er en ny, forenklet variant av Select som wrapper det native <select>-elementet med Jøkul-styling. Den bruker children i stedet for en items-array og standard React onChange — i motsetning til den stabile Select som har et egendefinert dropdown-grensesnitt. Planen er at BETA_Select erstatter den stabile varianten.

Viktig informasjon

  • BETA_Select er ikke ferdigstilt og API-en kan endre seg. Den mangler searchable, maxShownOptions og den egendefinerte SelectChangeEventHandler fra stabil Select.

Props

Props
Prop
Type
Påkrevd
Standard
Beskrivelse
childrenEgendefinertEksperimentellReactNode | ReactNode[]Ja—Innholdet i nedtrekksmenyen — typisk <option>-elementer.
labelEgendefinertEksperimentellstringJa—Synlig label over nedtrekksmenyen.
placeholderEgendefinertEksperimentellstringNei"Velg"Plassholdertekst som vises når ingenting er valgt.
errorLabelEgendefinertEksperimentellstringNei—Feilmelding vist under feltet.
helpLabelEgendefinertEksperimentellstringNei—Hjelpetekst vist under feltet.
valueNative HTMLEksperimentellstringNei—Valgt verdi (kontrollert).
onChangeReactEksperimentellChangeEvent<HTMLSelectElement>Nei—Standard React onChange — merk: ikke SelectChangeEventHandler som i stabil Select.
nameNative HTMLEksperimentellstringNei—Skjemafeltets navn.
disabledNative HTMLEksperimentellbooleanNei—Deaktiverer feltet.

Eksempler

Grunnleggende nedtrekksmeny

BETA_Select med <option>-elementer som children — ingen items-array.

TSX

Med grupperte valg

Native <optgroup> fungerer direkte siden BETA_Select wrapper den native select.

TSX

Med hjelpetekst og feilmelding

Du må velge en rolle
TSX

Relaterte komponenter

Select

Select er nedtrekksmenyen med egendefinert dropdown-grensesnitt.

Velg forsikringstype
RadioButton

RadioButton og RadioButtonGroup brukes for enovalgslister.

Autosuggest

Autosuggest er et tekstinputfelt som viser forslag mens brukeren skriver.