Skip to content

Commit

Permalink
Add docs for form/useSubmit navigate/fetcherKey
Browse files Browse the repository at this point in the history
  • Loading branch information
brophdawg11 committed Oct 26, 2023
1 parent f4462e5 commit 2c6b70a
Show file tree
Hide file tree
Showing 2 changed files with 18 additions and 1 deletion.
9 changes: 9 additions & 0 deletions docs/components/form.md
Expand Up @@ -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 `<Form navigate={false}>`. This is essentially a shorthand for `useFetcher()` + `<fetcher.Form>` 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 `<Form navigate={false} fetcherKey="my-key">`.

## `replace`

Instructs the form to replace the current entry in the history stack, instead of pushing the new entry.
Expand Down Expand Up @@ -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
Expand Down
10 changes: 9 additions & 1 deletion docs/hooks/use-submit.md
Expand Up @@ -150,7 +150,15 @@ submit(null, {
<Form action="/logout" method="post" />;
```

Because submissions are navigations, the options may also contain the other navigation related props from [`<Form>`][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>`][form] such as:

- `fetcherKey`
- `navigate`
- `preventScrollReset`
- `relative`
- `replace`
- `state`
- `unstable_viewTransition`

[pickingarouter]: ../routers/picking-a-router
[form]: ../components/form

0 comments on commit 2c6b70a

Please sign in to comment.