想要直接查看实现代码?请参考以下示例:
以下 API 描述了如何使用基础功能。
values: ReadonlyArray<number>
values: ReadonlyArray<number>
必填 范围选择器的当前值(或多个值)。
min: number
min: number
必填 范围的最小限制值。
max: number
max: number
必填 范围的最大限制值。
stepSize: number
stepSize: number
必填 可选步长之间的间隔距离。
onChange: (instance: Ranger<TTrackElement>) => void
onChange: (instance: Ranger<TTrackElement>) => void
当拖拽手柄释放时触发的回调函数。
handles: ReadonlyArray<{value: number; isActive: boolean; onKeyDownHandler(event): function; onMouseDownHandler(event): function; onTouchStart(event): function}>
handles: ReadonlyArray<{value: number; isActive: boolean; onKeyDownHandler(event): function; onMouseDownHandler(event): function; onTouchStart(event): function}>
需要渲染的手柄集合。每个 handle 包含以下属性:
activeHandleIndex: null | number
activeHandleIndex: null | number
当前被拖拽手柄的从零开始的索引值,如果没有手柄被拖拽则为 null。
Your weekly dose of JavaScript news. Delivered every Monday to over 100,000 devs, for free.