search

tleunen / react-number-editor

Custom number editor (text field) react component
MIT License
70 stars 15 forks source link

Enhancement: onValueChangeCompleted callback #19

Closed kmcluckie closed 8 years ago

kmcluckie commented 8 years ago

I'm hoping to use this component in an application that won't work well with constant value changes. It would be great to have onValueChangeCompleted or similar that gets called when the input loses focus (onBlur) or a drag is stopped (onMouseUp).

I had a crack at creating a PR for this but my React newbieness prevents me from completely grasping higher order components (at this stage).

tleunen commented 8 years ago

Thanks for the suggestion, I'll take a look to see what I can do :)

Is it because you want to use it in a "uncontrolled" way and only be notified when the user has finished editing the field?

kmcluckie commented 8 years ago

Not perfectly sure whether "uncontrolled" is what I'm looking for (issue #5?), but even if the value is constantly changed (as stored by the parent component as I understand that issue correctly), I'd at least like notification when the user has finished editing.

My use-case: a canvas is being re-rendered which is quite intensive and I'd like to only re-render when the user has finished editing the number. If you know of a better way of doing this than modification of your component then I'm all ears!

tleunen commented 8 years ago

Ah I see.. Indeed, it could be quite expensive to re-render the canvas at every change, especially if the user does quick changes. One other solution could also be to throttle the re-render using Lodash.throttle for example (https://lodash.com/docs#throttle)

That way, you can decide to re-render on every changes, but if more than 1 changes occurs in X ms (or seconds), it won't do anything.

kmcluckie commented 8 years ago

Thanks, I'll look into it.