Set Function Not Triggering Rerender
Answered
Northeast Congo Lion posted this in #help-forum
Northeast Congo LionOP
Hello! i have this code that i have written to rerender my conversation headers whenver a conversation is updated. At first I fetch the conversations from my db. Then i listen for socket events to tell me when a new conversation/updated conversation has arrived. When that happens I have the items variable change with that new function. My issue however is that the setItems does not trigger a rerender so no matter how many conversations get updated i have the same initial conversations appearing on my screen. i was wondering if anyone knows why this redener is not triggering. I have a suspicion that react can be setting the update to happen later in the future or not happen at all since it is modifying the interals of a conversation and not the conversations itself however I have tried just doing setItems([conversation]) to see if react would trigger the rerender there with no luck. printing out the conversation it seems that the socket server is doing its job and giving me the correct data. Wondering what I am doing wrong. If anyone could lead me in the right direction that would be wonderful!
Answered by Arinji
A way to fix, try and build your site with nextjs.. react will give errors with your deps arrays missing stuff
27 Replies
Can you use a paste site instead of just a file @Northeast Congo Lion
I don't trust downloads on discord
Northeast Congo LionOP
sure whats a paste site
Northeast Congo LionOP
hopefully this works
Which websockets functions are not rerendering @Northeast Congo Lion
Northeast Congo LionOP
oh sorry
just the first one seenhandler
setItems((current) => current.map((currentConversation) => {
if ( currentConversation.id === conversation.id ) {
return {
conversation
}
}
return currentConversation;
}))
if ( currentConversation.id === conversation.id ) {
return {
conversation
}
}
return currentConversation;
}))
So the messages aren't deleting themselves from the ui right?
Northeast Congo LionOP
this was the code in there from before that would actually update the conversations but have no conversation renders
but that code in there right now wont delete themselves yeah
when i print items after setting it to an empty list it still has the original list
so something about react is not rendering/updating
Ok so basically
can you try this
Northeast Congo LionOP
ill try anything at this point lol
So your deps arrays is broken
A way to fix, try and build your site with nextjs.. react will give errors with your deps arrays missing stuff
Answer
Fix it and then send just the useEffect code here
Northeast Congo LionOP
alright ill try that rq
Northeast Congo LionOP
hey! you were right. i used eslint in order to fix all the dependency errors and after going through them one by one sure enough my code worked. thank you sm for helping me out with this issue. i had no idea that tools like this would go through your code and help you fix all yours bugs!!!
no worries, mark a solution :D
thats how i usually fix skill issues with deps arrays lol