Hopp til innholdet
CONTENT · FREE

Highlighter

Marker søketreff i tekst slik at brukerne finner dem med en gang.

Marker hver forekomst av en søketekst i en streng, uten hensyn til store og små bokstaver med mindre du ber om noe annet.

Hvorfor det hjelper

  • Markerer treff
  • Alternativ for store og små bokstaver
  • Enkel

Hvor det passer

  • Søkeresultater
  • Lister
  • Dokumentasjon
Kontrollen Highlighter på en RayCraft-side

Eksempel

<SearchBox @bind-Value="_query" Label="Filter" Placeholder="Try 'ar'" SearchOnInput="true" OnSearch="@(_ => { })" />
<ul>
    @foreach (var country in _countries.Where(c => string.IsNullOrEmpty(_query) || c.Contains(_query, StringComparison.OrdinalIgnoreCase)))
    {
        <li><Highlighter Text="@country" Query="@_query" /></li>
    }
</ul>

@code {
    private string? _query = "ar";
    private readonly string[] _countries = ["Bulgaria", "Argentina", "Germany", "Norway", "Portugal", "Canada", "Spain"];
}

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