Siirry sisältöön

14.5.0

Breadcrumb

Murupolku sivuhierarkian ja käyttäjän sijainnin esitykseen.

Julkaistu versiossa 0.15.3

Esikatselu

Käyttötarkoitus

Murupolut koostuvat luettelosta linkkejä, jotka auttavat käyttäjää visualisoimaan sivun sijainnin verkkosivuston hierarkkisessa rakenteessa ja mahdollistavat navigoinnin ylätason sivuille.

Tee näin
  • Käytä kun halutaan näyttää polku tällä hetkellä avoinna olevalle sivulle.
  • Käytä kun halutaan antaa helppo tapa siirtyä takaisin ylätason sivuille.
  • Käytä syvissä navigointirakenteissa.
Älä tee näin
  • Älä korvaa otsikkoelementtejä murupolulla.

Saavutettavuus

BreadcrumbItem-komponentin active-prop asettaa aina automaattisesti aria-current="page"-attribuutin ruudunlukijoiden käyttäjille.

Jos sivulla on useita navigaatioelementtejä (HTML:n nav-elementti), navigaatio on hyvä erottaa muista navigaatioelementeistä aria-label-attribuutilla.

BreadcrumbItemin as-prop mahdollistaa halutun linkkikomponentin (esim. Router-kirjaston linkki) käytön. Muropolkulinkit rendataan kuitenkin aina li-elementin sisään.

Esimerkit

Skeleton