T
TanStack•3y ago
like-gold

Problems with comments and posts. Help!

Hello! I'm dealing with a problem and i would really be grateful with any help. I'm building a king of Instagram clone, and i want to show the comments of each post based on the post cod. But React Query only returns the comments of the last post, and the previous ones are returning undefined. Is this a cache problem? Is renewing the cache after every request?
10 Replies
deep-jade
deep-jade•3y ago
Could you show some code? It's hard to help you otherwise, as react-query doesn't have any fundamental issues with the situation you're describing.
like-gold
like-goldOP•3y ago
Thats the comments component, that is child of each and receives its postCod This is the query logic witch i use to get and refetch the comments after a comment send by a user with a mutate
like-gold
like-goldOP•3y ago
No description
No description
like-gold
like-goldOP•3y ago
No description
like-gold
like-goldOP•3y ago
As you can see, i've put '8' in the formData to test if would get some data from the post with code '8'. It does. I already verify if the postCod that i receive in the comments component is working fine. And it is. So, i dont know what's going on to only show the comments of the last post
deep-jade
deep-jade•3y ago
So first of all, I'm not sure it's a big deal or not, but you seem to be using the "old syntax" for react query, there the arguments for useQuery are ordered queryKey, queryFn, queryOptions, whereas now we're more used to 
useQuery({
  queryKey: [],
  queryFn: () => {},
  onSuccess: () => {}, 
})
useQuery({
  queryKey: [],
  queryFn: () => {},
  onSuccess: () => {}, 
})
but that isn't really your main issue, it just threw me off your main issue is that you are trying to query different things (different post comments) with the same queryKey which is always ['postsData'] the queryKey should uniquely identify a "cache entry", meaning that any query made with the same key will be happy to receive the same result So in your case, I'd suggest including the post ID (what you call postCod I think) in the queryKey. Luckily, it's supposed to be an array to make this easier! 
useQuery(['postsData', postCod], ...)
useQuery(['postsData', postCod], ...)
like-gold
like-goldOP•3y ago
Thank you so much for the answer. But i have bad news, it does not work. Even with the postCod as queryKey, the error is still there
like-gold
like-goldOP•3y ago
No description
like-gold
like-goldOP•3y ago
I did it! I was thinking about the key concept, for some reason, passing formData to useQueryPostsData function as a parameter wasn't a good ideia. So i decided to pass the appends of formData directly and do the formData inside this component. It worked I needed to change some things in useMutation too. I hope this works. So, let me know if i'm right: The key of a query is like a locker where we can save data? So, if a query has not a string, but a variable as a key, every time that mutate is called with this key, the query that will be re-cached will be the query with the exactly key?
deep-jade
deep-jade•3y ago
Yes that's right.

Did you find this page helpful?