Basic loader reload

[mgksmv]

Hello! When using basic loader how do I change route query without triggering data loader reload? I just want to change one query param without data loader rerun. Is it possible? Like an option in data loader to turn off automatic rerun or something.

[posva]

You can use the colada loader which does support it out of the box (if the query is not used, it won't reload)

[posva]

Normally it works. Maybe try to boil down a reproduction?

[mgksmv]

Ok. Here, for example. The simplest reproduction: https://stackblitz.com/edit/vitejs-vite-dftur96x?file=src%2FApp.vue,src%2Fpages%2Findex.vue

I defined Colada data loader and in script setup I added a setTimeout. After 5 seconds it sets some query param. You might notice how data changes in the screen after 5 seconds, it is the data loader reloading data for whatever reason. What I want is the ability to set route query params without reloading data loader.

[mgksmv]

I think I'll just migrate to Nuxt and use its built in function useAsyncData. The only optimal solution I found for fetching data before route enter.

[posva]

So you see a refresh() of the data (based on the slateTime of the data) after 5s which is expected. The default value of staleTime is 5 seconds but it can be made bigger if your data doesn't requires to be considered stale that often:

export const useClientsData = defineColadaLoader('/clients', {
  async query(to) {
    return getClients(to.params);
  },
  key: ['users'],
  staleTime: 30_000,
})

The colada loader does have a mechanism where it will reload if the route changed. Initially I didn't add that behavior to the basic loader but I might add it. Note that useAsyncData() always refetch, it doesn't track the route changes and that you can still data loaders with Nuxt!

[mgksmv]

Can't I just disable staleTime? So that it never auto refreshes data. I see there is autoRefetch param, but it's not doing what I expect it to do when set to false. I just simply want to turn off data autorefresh on route query params change.

[posva]

Set stake time to infinity

[mgksmv]

It works, thanks. But it would be nice to have an option to turn off autorefetch trigger when route query changes but the path is the same.

[posva]

That’s the option: controlling for how long the data is fresh. The point goes beyond data loaders themselves as it requires caching. If it never refreshes it, in most cases, becomes outdated at some point, and that’s exactly the point of staleTime, co trolling how long it takes for the data to be outdated. Pinia colada has two kind of fetching: refresh and refetch. Loaders only have a load. In the case of the colada loader, it refreshes of nothing on the consumed route changed (your case) while refetching otherwise

[mgksmv]

But still I need an option to exclude route query params from triggering data refresh. It will cover some of my edge cases where I just need to remove a query param WITHOUT refreshing data. Or to choose what should trigger refresh, like watch: (route) => route.path in my case, instead of route.fullPath. Then this package will be PERFECT. This is the only thing that is keeping me from using this package.