question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

TypeError when calling handleSubmit in react-native

See original GitHub issue

Bug

Current Behavior

The recommended usage of formik in react native is: <Button onPress={props.handleSubmit} />. However, when using typescript, the type of event that handleSubmit accepts is different than what react-native’s onPress generates.

Desired Behavior

Formik’s handleSubmit should take a GestureResponderEvent in addition to React.FormEvent<HTMLFormElement>.

Suggested Solutions

This branch fixes this issue: https://github.com/Shurelia/formik/tree/handleSubmit-fix Unfortunately, there is a typings conflict between @types/node and @types/react-native which prevents the build. Since the only type used from node was process, I’ve manually declared that as any and removed @types/node. Not an elegant solution, and I’d be open to working on it more if the maintainers are okay with removing @types/node from the project (and perhaps manually declaring process?).

Info

  • Formik Version: 0.10.5
  • OS: Windows 10
  • Node Version: 9.3.0
  • Package Manager and version: yarn 1.3.2
  • Typescript: 2.6.2
  • react: 16.2.0
  • react-native: 0.51.0

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:8 (2 by maintainers)

github_iconTop GitHub Comments

23reactions
wsdtcommented, Feb 25, 2019

For all coming here: The issue seems to be still open. If you simply want to remove the warning you can cast your object. It’s by far not the cleanest solution, but it’s better than nothing.

onPress={handleSubmit as any}

6reactions
vitalyiegorovcommented, Nov 5, 2020

@jaredpalmer Any valid solution for correct typing in react-native?

Read more comments on GitHub >

github_iconTop Results From Across the Web

React Native Typescript Formik cast event type - Stack Overflow
Given that I am getting the handleSubmit function from destructuring, how can I cast the type of event correctly? Note: I know I...
Read more >
useForm - handleSubmit - React Hook Form
This function will receive the form data if form validation is successful. Props. Name, Type, Description. SubmitHandler, (data: Object, e?: Event) ...
Read more >
'X' is not a function TypeError in React [Solved] | bobbyhadz
The React.js Uncaught TypeError: X is not a function occurs when we try to call a value that is not a function as...
Read more >
Handling Events - React
You have to be careful about the meaning of this in JSX callbacks. In JavaScript, class methods are not bound by default. If...
Read more >
What's the difference between `handleSubmit` and `onSubmit`?
From what I can tell from every example I have seen, there is an unwritten rule in the React community about handling form...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found