Open c0ncentus opened 3 years ago
If I understand this ticket correctly, this is something that I also wondered. I'm using this library with react-player, which is a player that is constantly updating its progress. So what I would need to do is detect when we are seeking, so I can stop updating my react-range instance. This could probably work by exposing this: isDragged: this.state.draggedThumbIndex > -1
with the help of an event for example: onDragStart
and onDragEnd
(which is probably = onFinalChange
, that is already available)
onDragStart and onDragEnd (which is probably = onFinalChange
right, onDragStart could be added, you might be also able to just use onChange
to detect when user starts moving the thumb
Example for posterity:
import * as React from 'react';
import { Range } from 'react-range';
class SuperSimple extends React.Component {
state = { values: [50], isDragging: false };
render() {
return (
<Range
step={0.1}
min={0}
max={100}
values={this.state.values}
onChange={(values) => {this.setState({ values, isDragging: true })}
onFinalChange={(values) => this.setState({ isDragging: false })}
// ...
/>
);
}
}
Hi,
I want make that https://codepen.io/c0ncentus/pen/LYRKdpL so the simplest way to customize it is with your component (thanks) .... Wait .... can you detect (event) when user dragEnter and leave the drag ?
I have wrapp with div tag and that is not work : / Currently support or not ?
Thanks to make React better 🤟