Escolha um valor inferior e um superior com um único controle. As duas alças são entradas range nativas, então se comportam como navegadores e tecnologias assistivas esperam.
Por que ajuda
- Dois valores, um controle
- Entradas range nativas
- Marcas aceitas
Onde se encaixa
- Filtros de preço
- Faixas de data ou idade
- Limites de pontuação
Exemplo
<RangeSlider @bind-Low="_low" @bind-High="_high" Label="Price range" Min="0" Max="1000" Step="10" />
<span>From @_low to @_high</span>
@code {
private double _low = 200;
private double _high = 700;
}Um pequeno trecho. Adicione @using RayCraft.Blazor.Components à sua página e use um modo de renderização interativo.
Incluído no RayCraft Free. Há exemplos funcionais no repositório do GitHub (MIT); ele contém código de exemplo e demonstração, não o código da biblioteca.