airbnb / rheostat

Rheostat is a www, mobile, and accessible slider component built with React
MIT License
1.69k stars 189 forks source link

Can't build a controlled component [Question] #76

Open bvandenbos opened 7 years ago

bvandenbos commented 7 years ago

updateNewValues ignores new props values when sliding. This reduces the ability to build completely controlled components using Rheostat (rheostat controls rendering while sliding).

A specific use-case: I'm building a 3 handle slider where the outer handles represent the bounds and the inner handle, the midpoint. When dragging an outer handle, I want to move the inner handle as well. As it stands, rheostat only updates the values after I've released the handle (ie: slidingIndex is null).

Clearly the code to skip updates while sliding was added intentionally. I was curious what the reasons are/were and, in general, if there's been consideration for such a use case as described above.

If I comment those lines out, my slider works as I'd expected.

For reference:

https://github.com/airbnb/rheostat/blob/master/src/Slider.jsx#L581

  updateNewValues(nextProps) {
    // Don't update while the slider is sliding
    if (this.state.slidingIndex !== null) {
      return;
    }
goatslacker commented 7 years ago

This is a case where a comment on why code was added would be super beneficial.

Anyway, if I recall correctly this was added so that Rheostat wouldn't be firing onChange events constantly which would cause all subscriptions to continuously update. I'm not sure if that's the case any more.

edit: It may have been related to the handles "skipping" around which was probably caused by poor performance from having these values updated constantly.