Commit e747fda

committed

update doc on useEffect usage

1 parent 03c3d5d commit e747fdaCopy full SHA for e747fda

File tree

+16

-5242

lines changed

+16

-5242

lines changed

Lines changed: 8 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -35,12 +35,20 @@ export default function App() {`
`35`	`35`	`const methods = useForm()`
`36`	`36`
`37`	`37`	`const onSubmit = (data) => console.log(data)`
	`38`	`+ const { register, reset } = methods;`
	`39`	`+`
	`40`	`+ useEffect(() => {`
	`41`	`+ reset({`
	`42`	`+ name: 'data'`
	`43`	`+ })`
	`44`	+ }, [reset]); // ❌ never put `methods` as the deps
`38`	`45`
`39`	`46`	`return (`
`40`	`47`	`<FormProvider {...methods}>`
`41`	`48`	`// pass all methods into the context`
`42`	`49`	`<form onSubmit={methods.handleSubmit(onSubmit)}>`
`43`	`50`	`<NestedInput />`
	`51`	`+ <input {...register('name')} />`
`44`	`52`	`<input type="submit" />`
`45`	`53`	`</form>`
`46`	`54`	`</FormProvider>`

Lines changed: 8 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -36,12 +36,20 @@ import { useForm, FormProvider, useFormContext } from "react-hook-form"`
`36`	`36`	`export default function App() {`
`37`	`37`	`const methods = useForm()`
`38`	`38`	`const onSubmit = (data) => console.log(data)`
	`39`	`+ const { register, reset } = methods;`
	`40`	`+`
	`41`	`+ useEffect(() => {`
	`42`	`+ reset({`
	`43`	`+ name: 'data'`
	`44`	`+ })`
	`45`	+ }, [reset]); // ❌ never put `methods` as the deps
`39`	`46`
`40`	`47`	`return (`
`41`	`48`	`<FormProvider {...methods}>`
`42`	`49`	`// pass all methods into the context`
`43`	`50`	`<form onSubmit={methods.handleSubmit(onSubmit)}>`
`44`	`51`	`<NestedInput />`
	`52`	`+ <input {...register('name')} />`
`45`	`53`	`<input type="submit" />`
`46`	`54`	`</form>`
`47`	`55`	`</FormProvider>`

Comments

(0)