滑块Slider
填写与选择在一个范围内拖动调整数值
音量、亮度和价格区间可以用滑块快速调整。界面要让用户看见范围和当前值，并支持键盘操作；需要准确输入具体数字时，可以同时提供数字输入框 InputNumber。
音量
亮度
什么时候用
- 音量、亮度这类连续调节🔊60
- 价格区间筛选：双滑块框定范围价格¥100 — ¥300
- 调节程度、强度：大概其就行创作强度较强
- 拖动时实时预览效果☀
什么时候不用
- 要精确到个位 → 用 数字输入框 InputNumber想正好调到 666？手会抖
- 只有两三个固定档 → 用 单选框 Radio总共就 3 档，摆出来更快
- 范围特别大（1 到 10 万）→ 直接输入2,431 / 100,000范围太大，拖半天动一点
- 选日期 → 用 日期选择器 DatePicker7 月 12 日？拖一个日期出来太别扭
组成结构 · Anatomy
60
1轨道Rail整段可选范围
2已选轨迹Track品牌色标识已选部分
3手柄Handle可拖动，悬停时放大
4当前值Value拖动时实时跟着变
常见变体 · Variants
默认Default
音量、亮度等连续量的调节
双滑块区间Range
要框定起止范围，比如价格带
带刻度With Marks
050100
帮用户对齐几个关键档位
禁用Disabled
该调节项当前不可用
典型使用场景
音量亮度调节
价格区间筛选
价格区间¥100 — ¥300
¥0¥500
已筛选出 86 件商品
图片缩放
缩放80%
10%200%
AI 创作强度
🤖 AI 写作设置