Hopp til innholdet
LAYOUT · FREE

Collapse

Vis detaljer bare når brukerne ber om dem.

Vis eller skjul innhold ved behov. Bind det til en hvilken som helst knapp og behold innholdet på siden mens det er skjult hvis du trenger det.

Hvorfor det hjelper

  • Fungerer med enhver knapp
  • Innholdet forblir lastet
  • Enkel

Hvor det passer

  • Avanserte alternativer
  • Detaljer
  • Filtre
Kontrollen Collapse på en RayCraft-side

Eksempel

<Button Variant="Variant.Outlined" OnClick="@(() => _open = !_open)" aria-expanded="@(_open ? "true" : "false")" aria-controls="@(_open ? "collapse-demo" : null)">
    @(_open ? "Hide details" : "Show details")
</Button>
<Collapse Expanded="_open" id="collapse-demo">
    <Card>Details that appear and disappear. The content is not rendered while collapsed.</Card>
</Collapse>

@code {
    private bool _open;
}

Et kort utdrag. Legg til @using RayCraft.Blazor.Components på siden din, og bruk en interaktiv gjengivelsesmodus.

Inkludert i RayCraft Free. Fungerende eksempler finnes i GitHub-arkiv (MIT); det inneholder eksempel- og demokode, ikke bibliotekets kode.

Alle kontroller ยท Dokumentasjon