Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Infinite loop encountered when using onValueChange without setting valueIsNumericString prop #786

Closed
muradsofi opened this issue Aug 14, 2023 · 3 comments
Labels

Comments

@muradsofi
Copy link

muradsofi commented Aug 14, 2023

Describe the issue and the actual behavior

I've encountered an issue when using the onValueChange callback with the NumericFormat component. Specifically, if I don't set the valueIsNumericString prop, my app enters an infinite loop. This seems to be directly related to how I set the value

Describe the expected behavior

The NumericFormat component should handle the onValueChange callback seamlessly, even when the valueIsNumericString prop isn't set, without causing any infinite loops.

If the valueIsNumericString prop is required, in that case, we need to inform the developer via console.error

Provide a CodeSandbox link illustrating the issue

https://codesandbox.io/s/isnumericstring-demo-forked-jnkhk3?file=/src/App.js:0-645

@s-yadav
Copy link
Owner

s-yadav commented Sep 3, 2023

Actually, this is a valid case. So react-number-format automatically tries to identify what type of value is passed in the value prop. As both formatted string or non-formatted string can be passed, there can be case where the library can't differentiate between formatted value or non-formatted value. Currently this differentiation happens if we find any prefix or suffix on the string, but if prefix or suffix is not provided it can fail to identify in some case.

Take an example of giving decimalSeparator as , and thousand separator as . (like in the sandbox). Now if we pass 10.000 this can be be either formatted value which will be 10 thousand or non formatted value 10 with three decimal precision.

This can not be thrown as error as library doesn't have enough knowledge about how the values props is consumed or set.

I think this is more of a documentation problem. I will mention the case on the doc.

https://s-yadav.github.io/react-number-format/docs/props/#valueisnumericstring-boolean

@s-yadav
Copy link
Owner

s-yadav commented Sep 3, 2023

Actually there is some bug as well, auto guessing is not working out due to regression. Ideally, if the thousand separator is not . then the library can identify if it is a formatted value or non-formatted value.
Fixing this.

@s-yadav
Copy link
Owner

s-yadav commented Sep 3, 2023

The reported issue is fixed on v5.3.1. Also update the doc for https://s-yadav.github.io/react-number-format/docs/props/#valueisnumericstring-boolean

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants