I am using RQ to infinite cache results of API by id of element but want re-fetch if user goes to another if and back.
e.g. if we multiple times query with id=1 API is called only once, but once we go to query id = 2 and back I want to re-fetch.
Here is code snippet
const useMyData = (key: string) => {
var queryclient = useQueryClient();
var currentQuery = useQuery({
queryKey: ['dataCommonKey', key],
queryFn: fetchDataForKey(key),
});
queryclient.removeQueries({ queryKey: ['dataCommonKey'], type: 'inactive' });
return currentQuery;
};
It all works fine but sometimes I get react warning with origination inside RQ.
react-dom.development.js:67 Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.
If I delete removeQueries call then no warning occurs.
Is this smth I should worry about or can just ignore? Or any suggestion what i should change in the code not to get this?