diff --git a/docs/components/form.md b/docs/components/form.md index 5d1c6bbc0b..5042c98700 100644 --- a/docs/components/form.md +++ b/docs/components/form.md @@ -197,6 +197,14 @@ function Project() { As you can see, both forms submit to the same route but you can use the `request.method` to branch on what you intend to do. After the actions completes, the `loader` will be revalidated and the UI will automatically synchronize with the new data. +## `navigate` + +You can tell the form to skip the navigation and use a [fetcher][usefetcher] internally by specifying `
`. This is essentially a shorthand for `useFetcher()` + `` where you don't care about the resulting data and only want to kick off a submission and access the pending state via [`useFetchers()`][usefetchers]. + +## `fetcherKey` + +When using a non-navigating `Form`, you may also optionally specify your own fetcher key to use via ``. + ## `replace` Instructs the form to replace the current entry in the history stack, instead of pushing the new entry. @@ -367,6 +375,7 @@ You can access those values from the `request.url` [useactiondata]: ../hooks/use-action-data [formdata]: https://developer.mozilla.org/en-US/docs/Web/API/FormData [usefetcher]: ../hooks/use-fetcher +[usefetchers]: ../hooks/use-fetchers [htmlform]: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form [htmlformaction]: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form#attr-action [htmlform-method]: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form#attr-method diff --git a/docs/hooks/use-submit.md b/docs/hooks/use-submit.md index 7e0ba425c2..566745bf53 100644 --- a/docs/hooks/use-submit.md +++ b/docs/hooks/use-submit.md @@ -150,7 +150,15 @@ submit(null, { ; ``` -Because submissions are navigations, the options may also contain the other navigation related props from [``][form] such as `replace`, `state`, `preventScrollReset`, `relative`, `unstable_viewTransition` etc. +Because submissions are navigations, the options may also contain the other navigation related props from [``][form] such as: + +- `fetcherKey` +- `navigate` +- `preventScrollReset` +- `relative` +- `replace` +- `state` +- `unstable_viewTransition` [pickingarouter]: ../routers/picking-a-router [form]: ../components/form