At vælge en delmængde fra en lang liste er nemmest med to lister og knapper til at flytte elementer mellem dem.
Hvorfor det hjælper
- To lister, tydelig bevægelse
- Godt til lange lister
- Nem at forstå
Hvor det passer
- Tildeling af brugere til en rolle
- Valg af kolonner
- Udvælgelse af produkter
Eksempel
<TransferList TItem="string" Items="_roles" @bind-Values="_chosen" Label="Roles" />
<span>Chosen: @(_chosen.Count == 0 ? "none" : string.Join(", ", _chosen))</span>
@code {
private readonly string[] _roles = ["Reader", "Editor", "Reviewer", "Publisher", "Administrator", "Auditor"];
private IReadOnlyCollection<string> _chosen = new List<string> { "Reader" };
}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.