in my opinion, it should be default behavior that all requests, even those made by reactive changes, use the cache if your definition of getCachedData() resolves cached data.

i.e. the definition of getCachedData() should be the "forcing" function to use the cache.

i understand that you're thinking about potential implications for folks that have already implemented this feature, but introducing a force parameter for something that you'd expect to be default behavior feels like a weird developer UX. just my thoughts!

i.e. the definition of getCachedData() should be the "forcing" function to use the cache.

I think that sounds fair, if the function is specified and returns data, it should be used instead of calling again by default.

But it'd be still nice to have a chance to bypass the function "on demand" (which would be equivalent to a hard reload or similar). I wonder if we need the force parameter for that though or if that could be implemented in userland (which I guess it could be easily. 🤔

ah, yes. maybe it would be best if reactive changes attempt to use the cache, but refresh() does not?

or, like you suggested, refresh() could use the cache unless the force parameter is passed into it? similar to tapping refresh vs shift+refresh in your browser.

Hi!

The problem is that key is changed.
You can try setting your own key.

const { data } = await useFetch('https://icanhazdadjoke.com/', {
  key: 'myOwnKey',
  query: { page },
  getCachedData: (key) => nuxt.payload.data[key] || nuxt.static.data[key],
  headers: {
    Accept: 'application/json',
  },
});

Hope this helps! 👋

Hi!

The problem is that key is changed. You can try setting your own key.

const { data } = await useFetch('https://icanhazdadjoke.com/', {
  key: 'myOwnKey',
  query: { page },
  getCachedData: (key) => nuxt.payload.data[key] || nuxt.static.data[key],
  headers: {
    Accept: 'application/json',
  },
});

Hope this helps! 👋

I thought so too initially but it is not enough if e.g. query is reactive.

I thought so too initially but it is not enough if e.g. query is reactive.

Do you mean like in this example?

As soon as you use a page parameter it works, but if you "re-use" a local useFetch call it is tricky

As soon as you use a page parameter it works, but if you "re-use" a local useFetch call it is tricky

Thanks, I get it now 🙂

There's already an option in asyncData - _initial, I think it could help because it will return the cached data if you set it to true.

 if ((opts._initial || (nuxt.isHydrating && opts._initial !== false)) && hasCachedData()) { 
   return Promise.resolve(options.getCachedData!(key)) 
 } 

So this could be the way to "re-use" a local useFetch

<button @click="refresh({ _initial: true })">New Joke (refresh)</button>

Maybe it's a bit "hacky" but it should work 🤔

@darioferderber _initial is an internal app not meant for usage though (hance the _ in the name 😋) - so yes, that might work but better DX would be nicer.

@darioferderber _initial is an internal app not meant for usage though (hance the _ in the name 😋) - so yes, that might work but better DX would be nicer.

Yup, I know, but it could help @broox if he's still struggling with this issue 😄

I agree, there should be a better DX to deal with this, but basically it should work the same as _initial

@darioferderber - i don't think the private _initial hack helps because i'm not calling refresh() manually.

the http request is automatically triggered when i change the reactive query parameters of useFetch(). in this case, i'd simply like the request to respect the cached data.

the http request is automatically triggered when i change the reactive query parameters of useFetch(). in this case, i'd simply like the request to respect the cached data.

Internally, a refresh is called IIRC. But that doesn't help because you can't pass the prop there indeed.

Is there any update on this one? I spent quite a while thinking it was my own bug trying figuring out why my getCachedData function was only being triggered on the initial requests and not re-used when my watch sources changes.

This would be a great addition and could save me a bunch of request with my paginated data.