Choisissez une valeur basse et une valeur haute avec un seul contrôle. Les deux poignées sont des champs range natifs, donc elles se comportent comme les navigateurs et les technologies d’assistance l’attendent.
Pourquoi c’est utile
- Deux valeurs, un contrôle
- Champs range natifs
- Repères pris en charge
Où il trouve sa place
- Filtres de prix
- Plages de dates ou d’âges
- Limites de score
Exemple
<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;
}Un court fragment. Ajoutez @using RayCraft.Blazor.Components à votre page et utilisez un mode de rendu interactif.
Inclus dans RayCraft Free. Des exemples fonctionnels se trouvent dans le dépôt GitHub (MIT); il contient du code d’exemple et de démonstration, pas le code de la bibliothèque.