-
I use the approach described in this cool article. So I can do things like const options = queryOptions({
queryKey: ['hello'],
queryFn: () => Promise.resolve(1234),
select: (userId) => `Hello, user ${userId}`,
});
// `.data` is a string in TypeScript and runtime
const baseQuery = useQuery(options);
const suspenseQuery = useSuspenseQuery(options);
const queries = useQueries({ queries: [options] }); However, the select function isn't respected by queryClient methods: const options = queryOptions({
queryKey: ['hello'],
queryFn: () => Promise.resolve(1234),
select: (userId) => `Hello, user ${userId}`,
});
const queryClient = useQueryClient();
// results are numbers in TypeScript and runtime
const fetchQueryResult = await queryClient.fetchQuery(options);
const ensureQueryDataResult = await queryClient.ensureQueryData(options); This is unexpected behavior, and I'm trying to understand the reason for not supporting select in the lower-level queryClient API. |
Beta Was this translation helpful? Give feedback.
Answered by
TkDodo
Jun 27, 2024
Replies: 1 comment 6 replies
-
|
Beta Was this translation helpful? Give feedback.
6 replies
Answer selected by
revyh
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
select
is an option of theQueryObserver
, and it can transform data that is cached for each instance (ofuseQuery
) separately. It doesn't work on imperative methods because they don't create a QueryObserver.