Query won't refresh when new instances of the query mount about query

[NetanelBasal]

It's because it's cached.

[seanbruce]

With react-query, when new component that use useQuery mounted, the data cached in queryClient with the same key in useQuery will returned for rendering and at the time refetching new data at the background. from the users pecpective, they saw cached data immediately and will see content update if the refetching return different data. The cache behavior is the same for angular query, but not the refetching behavior.

[NetanelBasal]

In your react application, could you try setting in the global query config the staleTime to Infinity and tell me if it still works the same?

[seanbruce]

After setting staleTime to Infinity, the query won't refetch on re-mounted. so, In my Angular application, after setting the stateTime of useQuery to 0, it will refetch automatically when component re-mounted.

 getTodos() {
    return this.#useQuery(
      ['todos', 'list'],
      () => {
        return getTodos();
      },
      { staleTime: 0 }
    );
  }

In according to the reference of useQuery in the docs, staleTime is default to 0. I wondered why the default is different in angular query, just curious.

[NetanelBasal]

It's just a hunch based on my usage. But now I wonder if it's better to leave the default as react-query to avoid future discussions like this.

[NetanelBasal]

Now I also wonder if it's the same issue here - #56

Can you check it with staleTime set to 0, please?

[seanbruce]

Sure, and after setting options like this

getTodos() {
    return this.#useQuery(
      ['todos', 'list'],
      () => {
        return getTodos();
      },
      { staleTime: 0, refetchOnWindowFocus: true }
    );
  }

The query still won't refrech on windows focus. no matter refetchOnWindowFocus set to true or "always".

[NetanelBasal]

Thanks. I'll remove the default staleTime that we set.

[seanbruce]

@NetanelBasal Thanks for your response. I'll close this issue.

[NetanelBasal]

Done