The problem: When doing multiple requests to the same endpoint, useLazyQueryHook will return a response only with the latest query with status set to 'fulfilled' and response data, while other requests made before are stuck with status 'pending' and without response data.
Desired functionality: The lazy query hook does not overwrite the previous returns (if overwrite is the case) but returns data from each query which can be accessed in a useEffect hook f.ex. Is this possibly not the correct approach for this use case when using RTK?
I have the following endpoint within createAPI...
getLoggerCheck: builder.query<any, any>({
query: ({ loggerId }) => ({
url: '/scan/check',
params: {
logger: loggerId,
}
}),
transformResponse(data: any) {
console.log(data); // <---- Correct data for each request is logged out here
return data;
}
})
... but when using the generated useLazyGetLoggerCheckQuery hook like so and making approx 5 requests / sec with runLoggerChecks({loggerId: XXXXX})
only the most recent query is returned with data and status 'fulfilled'.
const [runLoggerCheck, loggerCheckResponse] = useLazyGetLoggerCheckQuery();
useEffect(() => {
console.log(loggerCheckResponse)
}, [loggerCheckResponse]);