Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[idea] useRefetch #218

Open
horyd opened this issue Oct 26, 2018 · 5 comments
Open

[idea] useRefetch #218

horyd opened this issue Oct 26, 2018 · 5 comments

Comments

@horyd
Copy link

horyd commented Oct 26, 2018

Would be really cool if the classical react-refetch API could be extrapolated into the React Hooks style syntax. Here's what I've cooked up so far: https://codesandbox.io/s/52j3760v4n

Basically you'd need to record two different types of hooks, one for synchronous hooks that fire immediately/always and one for async hooks that require a function to be executed. I've used a simple queue in the example but it could just as well work by overwriting a single "last request" and then using the useEffects comparing array to run a comparing function (like the default refetch comparing function for instance)

Either way I think there's a decent amount of potential in it. What do you all think?

@slorber
Copy link

slorber commented Oct 27, 2018

hi @horyd

I've build this: https://github.com/slorber/react-async-hook

maybe it's what you were looking for?

@horyd
Copy link
Author

horyd commented Oct 28, 2018

Hi @slorber!

Cool package. Does that just take a regular promise as an argument? How is fetchStarwarsHero dependent on id?

If you like check out these two posts I wrote on the topic, the second one in particular might be handy as it is for triggering async behaviour on UI actions.

https://medium.com/@jaryd_34198/seamless-api-requests-with-react-hooks-part-1-7531849d8381
https://medium.com/@jaryd_34198/seamless-api-requests-with-react-hooks-part-2-3ab42ba6ad5c

Happy to chat/collab, let me know :)

@slorber
Copy link

slorber commented Oct 28, 2018

it takes an async function, the 2nd args is the async fn args that will be injected. If they change data is refetched

I'm trying to figure out if my code makes any sense, because suspense probably makes this useless

@horyd
Copy link
Author

horyd commented Oct 29, 2018

I was taking a closer look at Suspense and it kind of applies mostly to the conditional/asynchronous rendering, not so much to the actual logic. I spent a bit of time exploring the concept of triggered async actions in that second article because in Suspense that would look a little odd?

You would need to have the onClick handler set a state variable that then rendered the Suspense component and from within that you made the POST request and handled the response?

@dpzxsm
Copy link

dpzxsm commented Dec 28, 2019

I have open sourced a library very similar to react-retch, named react-decorate-fetch, I would be very happy if someone can help me maintain it together.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants