React 用 の Slider UI plugin つくりました

react-simple-slider

github.com

趣味アプリ作ってる時に既存のものを利用しようと思ったのですが, 既存のものがビミョだったので,1から作りなおしました.

(具体的には,デザインを変えづらかった,DOM構造が複雑だった.個人的にもっとシンプルなのが欲しかった)

使い方

      <Slider
        height={20}
        width={300}
        default={150}
        max={300}
        onChange={onChange}
        backStyle={{ backgroundColor: 'black', }}
        frontStyle={{ backgroundColor: 'red' }}
      />

みたいな感じです.

なるべくシンプルになるようにしました.

ref を指定すると

const value = this.refs.slider.getValue();
this.refs.slider.setValue(value);

みたいな感じで setValuegetValue を利用することができます.