Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 3 additions & 2 deletions src/content/docs/useform/handlesubmit.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@ This function will receive the form data if form validation is successful.

```typescript copy sandbox="https://codesandbox.io/s/react-hook-form-handlesubmit-ts-v7-lcrtu"
import React from "react"
import { useForm, SubmitHandler } from "react-hook-form"
import { useForm, SubmitHandler, SubmitErrorHandler } from "react-hook-form"

type FormValues = {
firstName: string
Expand All @@ -67,6 +67,7 @@ type FormValues = {
export default function App() {
const { register, handleSubmit } = useForm<FormValues>()
const onSubmit: SubmitHandler<FormValues> = (data) => console.log(data)
const onError: SubmitErrorHandler<FormValues> = (errors) => console.log(errors)

return (
<form onSubmit={handleSubmit(onSubmit)}>
Expand Down Expand Up @@ -109,7 +110,7 @@ import { useForm } from "react-hook-form";
const sleep = ms => new Promise(resolve => setTimeout(resolve, ms));

function App() {
const { register, handleSubmit, formState: { errors }, formState } = useForm();
const { register, handleSubmit, formState: { errors } } = useForm();
const onSubmit = async data => {
await sleep(2000);
if (data.username === "bill") {
Expand Down
31 changes: 31 additions & 0 deletions src/content/ts.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,37 @@ export default function App() {

---

## \</> SubmitErrorHandler {#SubmitErrorHandler}

```typescript copy
import React from "react"
import { useForm, SubmitHandler, SubmitErrorHandler } from "react-hook-form"

type FormValues = {
firstName: string
lastName: string
email: string
}

export default function App() {
const { register, handleSubmit } = useForm<FormValues>()
const onSubmit: SubmitHandler<FormValues> = (data) => console.log(data)
const onError: SubmitErrorHandler<FormValues> = (errors) => console.log(errors);

return (
<form onSubmit={handleSubmit(onSubmit, onError)}>
<input {...register("firstName"), { required: true }} />
<input {...register("lastName"), { minLength: 2 }} />
<input type="email" {...register("email")} />

<input type="submit" />
</form>
)
}
```

---

## \</> Control {#Control}

```typescript copy sandbox="https://codesandbox.io/s/control-2mg07"
Expand Down