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

Add support for suspense option #17

Closed
wants to merge 1 commit into from
Closed

Add support for suspense option #17

wants to merge 1 commit into from

Conversation

zxqx
Copy link
Member

@zxqx zxqx commented Aug 19, 2019

This PR adds support for a suspense option to the useFetch hook.

import { useFetch } from 'use-fetch-hooks';

const Child = () => {
  const { data } = useFetch('https://example/api', { suspense: true });

  return <div>{data}</div>;
};

const Parent = () => (
  <React.Suspense fallback="Loading...">
    <Child />
  </React.Suspense>
);

A few notes:

  • react-cache (the default cache container maintained by the React team) is still unreleased, in major flux, and currently in a broken state, so I had to build an old version and check it into the repo for now
  • Using suspense and lazy together is not yet possible with react-cache (without some nastiness), so useLazyFetch has no suspense option yet

Other unrelated things:

  • Disabled react/prop-types as we'll be adding TypeScript soon and won't have a need for prop types
  • Added import/resolver setting so importing external dependencies (like react) don't throw lint errors
  • Enabled source maps in example app
  • Created Container component for example implementations

Closes #6

@zxqx zxqx requested a review from jpangelle August 19, 2019 07:40
@@ -1,15 +1,15 @@
import { useState } from 'react';
import axios from 'axios';

export default config => {
export default url => {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

With this change, how would a different method other than GET be passed in?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, good catch. This should actually be axios, not axios.get.

@zxqx
Copy link
Member Author

zxqx commented Aug 19, 2019

Closing for now - we can revisit this when data fetching with Suspense gets official support.

@zxqx zxqx closed this Aug 19, 2019
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

Successfully merging this pull request may close these issues.

Support React Suspense
2 participants