Preview:
// This will not work in React 16 and earlier
const CreateTodo = () => {
  const mutation = useMutation({ mutationFn: event => {
    event.preventDefault()
    return fetch('/api', new FormData(event.target))
  }})


  return <form onSubmit={mutation.mutate}>...</form>
}


// This will work
const CreateTodo = () => {
  const mutation = useMutation({ mutationFn: formData => {
    return fetch('/api', formData)
  }})
  const onSubmit = event => {
    event.preventDefault()
    mutation.mutate(new FormData(event.target))
  }


  return <form onSubmit={onSubmit}>...</form>
}
downloadDownload PNG downloadDownload JPEG downloadDownload SVG

Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!

Click to optimize width for Twitter