Accordion
Bruk av accordion
Accordion brukes der du har mye informasjon som du ønsker å gjøre tilgjengelig for brukere, uten at alt er visuelt synlig samtidig. En accordion er bygget opp av en «header» og et «panel», og i SpareBank 1 er hele «headeren» klikkbar.
Accordion
En accordion er bygget opp av to komponenter: Accordion
og AccordionItem
.
Accordion-komponenten legges rundt alle AccordionItem's, for å gruppere og sette samme overskriftsnivå på alle.
AccordionItem
AccordionItem er hver enkel «header»- og «panel»-seksjon. De er lukket by default, men du kan velge at den skal være åpen fra start ved å sende med property defaultOpen
.
Alle <AccordionItem />
-komponenter har innebygget funksjonalitet for å styre
åpning og lukking. Men om ønskelig kan du også overstyre dette. Et bruksområde
kan være å lage en komponent som kun kan ha ett element åpent om gangen.
Bruker man isOpen
-propen vil intern-logikk som styrer åpning og lukking være skrudd av.