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

React native documentation should be updated to clarify proper type safe usage. #4002

Open
pedsm opened this issue Oct 22, 2024 · 1 comment

Comments

@pedsm
Copy link

pedsm commented Oct 22, 2024

Bug report

This is not a bug but rather a mis-documentation.

Current Behavior

The following docs explain how to use formik with RN

Although the explanation makes sense by calling out that handleSubmit needs to be bound to a button press and not a form submission it shows an example of onPress={handleSubmit}

Which is not technically correct.

RN's OnPressEvent is a GestureResponderEvent while handleSubmit expects a FormEvent

Expected behavior

handleSubmit expects a form event and does only 2 things with this event:

  const handleSubmit = useEventCallback(
    (e?: React.FormEvent<HTMLFormElement>) => {
      if (e && e.preventDefault && isFunction(e.preventDefault)) {
        e.preventDefault();
      }

      if (e && e.stopPropagation && isFunction(e.stopPropagation)) {
        e.stopPropagation();
      }
  1. Prevent default (this is to prevent a browser from sending an http request)
  2. Stop propagation (again this is to prevent browser behaviour)

After those 2 are complete the event is not needed.

Since those are not relevant in a React Native context then I propse we change the documentation for React-Native to prompt users to use it as such:

         <Button onPress={handleSubmit} title="Submit" />

This doesn't require any changes to the handleSubmit function such as the patch solution proposed here #3233 (comment)

Neither the non type safe solutions mentioned in a few other issues such as:

#3690
#3646
#3233

Reproducible example

Suggested solution(s)

Update the docs to indicate that react native users should not be passing in onPress events into the handleSubmit method

Additional context

#3690
#3646
#3233

@pedsm
Copy link
Author

pedsm commented Oct 22, 2024

Happy to submit a PR to amend the docs assuming this approach seems sensible

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

No branches or pull requests

1 participant