How do you use setStatus, setSubmitting inside handleSubmit function.

[jamesvibar]

How do I use, setSubmitting, setStatus etc. in handleSubmit function?

I would like to set the submit button's text to "submitting".

My form success message doesn't show if I put the return function inside a setTimeout (trying to simulate data being sent to a server)

import { useFormikContext } from 'formik'

const handleSubmit = useCallback(values => {
  setSubmitting(true)
  setTimeout(() => {
    setSubmitting(false)
    return {
      message: "success"
    }
  }, 5000) 
}, [])

[zaguiini]

The onSubmit function expects a Promise. Sorry about that, it's not clear in the docs and also the Typescript definitions doesn't show that. Whatever you return from that handleSubmit callback will be set as the status. For your example to work, you must do:

import { useCallback } from 'react'

const handleSubmit = useCallback((values) => {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve({
        message: "success"
      })
    }, 5000)
  })
}, [])

While that Promise doesn't resolve or reject, the isSubmitting flag is set to true. The status is set automatically from the return of that Promise - literally anything you return.

Fixed in v3.0.2.