V5 queryClient.getQueryData argument is changed to accept only a queryKey

[joel-daros]

We're trying to migrate to V5, but this breaking change is preventing us.

I have the following code:

  const selectedParameter = "123"; // this values comes from the query params

  // this is the partial name of the query. The complete query key is a huge and complex key based on multiple dynamic parameters
  // it’s impossible to retrieve the complete query key at this point of the code.
  const queryKey = ["foo", selectedParameter];

  // get data from the current react query cached data
  const pivotResponse = queryClient.getQueryData(queryKey, {
    exact: false,
    type: "active",
  });

Is there any alternative to request an active cached data without know the complete query key in V5?

[TkDodo]

queryClient.getQueryCache().find(queryKey, {
  exact: false,
  type: "active",
}

but this approach is quite brittle: if you have multiple active queries, you'll get a "random" one. Also, where do you need getQueryData if not for optimistic updates?

It's best practice to make all parameters that you need to make a query available to all places that need them. This is a "client state management" problem

[joel-daros]

I know I will only have a single active query for that key that I’m passing in. I’m using it to get a specific value from cache where I can’t call the hook. Yes, it’s very specific case, which we may we need to refactor in the future, but the old two parametersgetQueryData() were meeting our needs well.

[TkDodo]

Then the solution I showed is just as good 👍

[joel-daros]

It works fine for now. Thanks TkDodo.

Just a heads up for who also needs this solution, the find() method changed a bit in V5:

queryClient.getQueryCache().find({
  exact: false,
  type: "active",
  queryKey,
});

[TkDodo]

Yeah find takes a queryFilters object now, and key is just a possible filter 👍