组件

OneSlider

OneSlider 使用原生 range 输入，值被钳制到 min–max，并支持受控与非受控模式。

查看代码收起代码

import { OneSlider, type OneSliderValueEvent } from '@geektech/one';

const slider = new OneSlider({
  defaultValue: 60,
  min: 0,
  max: 100,
  showValue: true,
  ariaLabel: '音量',
});
slider.on('change', (payload) => {
  const event = payload as OneSliderValueEvent;
  console.log(event.value);
});

API

OneSlider API
名称	签名	说明
`value`	`value?: number`	受控数值。
`defaultValue`	`defaultValue?: number`	非受控初始值。
`min / max`	`min?: number; max?: number`	范围边界，默认 0–100；值会被钳制。
`step`	`step?: number`	步进值，默认 1。
`disabled`	`disabled?: boolean`	禁用滑块。
`showValue`	`showValue?: boolean`	显示当前值。
`ariaLabel`	`ariaLabel?: string`	滑块的访问名称。
`input / change`	`(event: OneSliderValueEvent) => void`	数值变化时发出 value: number 与 originalEvent: Event。