final-form / react-final-form

🏁 High performance subscription-based form state management for React
https://final-form.org/react
MIT License
7.38k stars 480 forks source link

form.reset() causes additional unpredictable effects and errors (bug report) #414

Open Vvtu opened 5 years ago

Vvtu commented 5 years ago

bug report

What is the current behavior?

form.reset() causes additional unpredictable effects and errors (bug report)

What's your environment?

Windows-7 Chrome-66 react-final-from@4.0.2 final-from@4.11.0 final-from-focus@1.1.0

Fixed by preventDefault()

Hear the code of reset button with preventDefault function: <Button onClick={(e) => { form.reset(e); e.preventDefault(); }} disabled={pristine || submitting}> {'Reset'}

Sharakai commented 5 years ago

Is this <Button /> inside a <form> tag? The default button type is "submit", so clicking on it will try to submit the form it is inside. If this is it, then it's standard browser behaviour and not an issue with the library, and you can fix this easily by providing the type="button" prop.

If this isn't the problem, please can you provide a codesandbox example of the issue?

Vvtu commented 5 years ago
  1. Yes. The
  2. Now, after your comment, I think I have found what causes such strange behavior. It is my <Button /> component. It is from custom special library that I have to use . If I replace it with simple <buttom /> html tag than everything is ok. There is no strange behavior in this case.

So, thank you. Now no problem exists. I will use preventDefault to fix this case.