Navigates? | declarative? | Makes GET, triggers loader | Makes POST, triggers action | No requests |
---|---|---|---|---|
navigates | declarative | <Link to=""> <Form method="get"> |
<Form method="post"> |
<Link to="#..."> |
navigates | imperative | navigate() setSearchParams() |
submit() |
navigate("#") |
stays | declarative | <fetcher.Form method="get"> |
<fetcher.Form method="post"> |
(doesn't make sense) |
stays | imperative | fetcher.load() |
fetcher.submit() |
(doesn't make sense) |
where
const fetcher = useFetcher();
const navigate = useNavigate();
const submit = useSubmit();
const [searchParams, setSearchParams] = useSearchParams();
- Navigates means:
- Remix navigates to the requested URL
- New history is added so you can go back to the page where you were, after making the request
- Up to one request per page: You assume only one request with "navigates" type can happen at a time
- Stays means:
- Remix doesn't navigate to the requested URL, but stays with the same page
- History is untouched
- Up to one request per fetcher: You assume multiple requests with "stays" type can happen at once on a page
This is nice! Is this a custom table you created from read the docs, that is, remix docs don't have this same exact table for requests?
As someone who is new to Remix myself, this table was useful in helping me piece together mentally the remix APIs :pray
Tips/questions/suggestions
maybe somewhere on the table we should include PUT, DELETE in the table cells?
Can I share your cheetsheet with friends on Twitter?