Switch

() => {
  const [checked, setChecked] = React.useState(false);
  return (
    <div>
      <Label>Ønsker du å motta nyhetsbrev?</Label>
      <Switch checked={checked} onChange={() => setChecked(!checked)}>
        Ja takk
      </Switch>
    </div>
  );
}

Bruk Switch når

brukeren skal veksle mellom to tilstander (av/på) for en binær handling som aktiveres eller deaktiveres umiddelbart, uten behov for bekreftelse eller lagring

Unngå Switch når

brukeren må bekrefte valget sitt, bruk heller Checkbox

Retningslinjer

Switch bør ha en ledetekst som forteller hva brukeren slår av og på.

Automatisk effekt, ikke bekreftelse

Gjør

Bruk switch til å slå på eller av en funksjon/innstilling som gir automatisk oppdatering eller automatisk lagring.

Unngå

Unngå å bruke radioknapper for å slå innstillinger av eller på. Radioknapper indikerer at bare ett kan velges om gangen og krever et ekstra steg for lagring.