Passing options

[tyleratredspace]

Passing options such as headers to useFetch will never resolve a response (no error either). The network request is still made and finishes, but the response does not resolve in the app.

WORKS: const { error, data } = useFetch(url); When logging out the useFetch arguments a successful request looks like this.

FAILS:

const { error, data } = useFetch(url, {
  headers: {
    // SOME HEADERS HERE
  }
});

ALSO FAILS:

const { error, data } = useFetch(url, {}); // This is strange as defaultOpts are also {}

When logging out the useFetch arguments a failed request looks like this.

[dai-shi]

This is tricky part of render. Either define opts outside of render, or useMemo.

I should clearly note it somewhere...

[tyleratredspace]

Wow, that works! You just saved me so much time!

[dai-shi]

One note just in case: This is an experimental library to try Fetch and Suspense. If you need more stable one without Suspense, I recommend another library of mine: https://github.com/dai-shi/react-hooks-async which has similar useFetch.

[zerdos]

I also spent 3-4 hours of debugging before I found this thread. It should give you an error message with an explanation when the render fails because of this reason.

[dai-shi]

Good point. If it's invoked several times in a short period, we could show a message, only in DEV mode.

Only a hesitation I have is that I can tell what's happening but not a solution. I'm still looking for a best practice how to deal with it. I tried a naive useMemoPrev in examples/02_extended because useMemo could forget a memoized value.

[dai-shi]

I misunderstood something. It's far more complicated. e02a68d460ff31186302a24ac802b839f91058ae shows the message but it's really a dirty hack.

Please use https://github.com/dai-shi/react-hooks-async unless you need to do some experiments on Suspense.

[dai-shi]

See: https://github.com/dai-shi/react-hooks-fetch/blob/1f420deb7515932b6cb469fcfc75c4dbc9e627a0/examples/02_extended/src/index.js#L6

This uses useMemoOne to provide semantic guarantee. https://github.com/alexreardon/use-memo-one