vlad-ignatov/react-numeric-input

Detecting if value is changing

Opened this issue · 2 comments

Hi there!
At first, thank you for such an awesome component!
I am trying to use it in together with undo/redo system and I don't wanna save all the changes. It could happen when you press spinner's button. Then the value is changing until you release the mouse, right? To me only latest value is need to be saved into the undo/redo stack. So I need to detect when it stopped changing the value (e.g. by mouse up handler). How can I do that? Is there any event like this?

There are events like mouseUp but they are not perfect for your case. I might consider adding special event for that in future versions, but for now your best option is to debounce your change handler. An example function could look like this:

function onChange(value, strValue, input) {
    if (onChange.timer) {
        clearTimeout(onChange.timer);
    }
    onChange.timer = setTimeout(() => {
        console.log(value); // Do something with value
    }, 70);
}

Hope that helps.

Debouncing to me is just a workaround. But thank you anyway.