Изберете долна и горна стойност с една контрола. И двете дръжки са родни полета range, така че се държат така, както браузърите и помощните технологии очакват.
Защо помага
- Две стойности, една контрола
- Родни полета range
- Поддържа деления
Къде пасва
- Ценови филтри
- Диапазони на дати или възраст
- Прагове на оценки
Пример
<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;
}Кратък фрагмент. Добавете @using RayCraft.Blazor.Components към страницата си и ползвайте интерактивен режим на рендиране.
Включено в RayCraft Free. Работещи примери има в хранилище в GitHub (MIT); то съдържа примерен и демонстрационен код, не кода на библиотеката.