En liste grupperet efter begyndelsesbogstav med en bogstavbjælke øverst. Et tryk på et bogstav flytter fokus og visningen til den del af listen.
Hvorfor det hjælper
- Spring efter bogstav
- Grupperet liste
- Tastaturvenlig
Hvor det passer
- Fortegnelser
- Ordlister
- Kontaktlister
Eksempel
<TitleIndex TItem="string" Items="_names" OnItemClick="Pick" Label="Countries by first letter" />
<p>@(_picked is null ? "Choose a letter, then a name." : "You chose " + _picked + ".")</p>
@code {
private string? _picked;
private readonly string[] _names =
{
"Albania", "Austria", "Belgium", "Bulgaria", "Croatia", "Cyprus", "Denmark", "Estonia", "Finland", "France", "Germany", "Greece",
"Hungary", "Iceland", "Ireland", "Italy", "Latvia", "Lithuania", "Malta", "Norway", "Poland", "Portugal", "Romania", "Spain", "Sweden"
};
private void Pick(string name) => _picked = name;
}Et kort uddrag. Tilføj @using RayCraft.Blazor.Components til din side, og brug en interaktiv gengivelsestilstand.
Inkluderet i RayCraft Free. Fungerende eksempler findes i GitHub-lager (MIT); det indeholder eksempel- og demokode, ikke bibliotekets kode.