Search code examples
reactjsinvalidationreact-cache

unstable_createResource invalidation in react-cache/suspense

How do I invalidate a resource created by react-cache?

I can fetch data from API:

const FooResource = createResource(id => fetch(`/foo/${id}`)); // return a promise, or async/await

// inside render...
const fooResponse = FooResource.read(id); // suspends if not in cache; renders if in cache
return <div> {fooResponse} </div>;

However, when I update the data on the backend I am unable to refetch the data on the frontend.

This is the only somehow official documentation that I was able to find: https://github.com/sw-yx/fresh-concurrent-react/blob/master/apis/react-cache.md

Is there some undocumented API that I can use? 🤔

Solution

  • In general — you can't, and this is why it's "unstable". Don't use it for anything except demos and tinkering. We'll likely replace the whole thing with a different API.