Master React State By Solving This Problem

[@qazyhn94]

i think the reason of this: you should not do this in the fist place, its weird implementation you always expect counter to be there just with a different prop, so then render it once and change the prop instead of rendering it twice, then its obvious that prop change wont reset state (unless its implemented inside Counter component)

[@theReal_WKD]

The main takeaway here is the use of the "key" prop which basically tells React to create 2 different references for the "same" component. But you're right about the implementation, it's not optimal. I would change isPlayerA state for "player/setPlayer" which could be "A" | "B". Then just render

[@qazyhn94]

@theReal_WKD exactly, but yes I was not aware of this behavior, good to know

[@doby3288]

Nice explanation, but I was curious the whole time, about how is `Counter` component implemented.

[@zshanahmad2669]

probably somthing like this: fun Counter(){ const [count, setCount] = useState(0); return setCount(c => c+1) } > {count} }

[@doby3288]

@@zshanahmad2669 Yeah, something like that... I found the implementation in the provided link in the description, but thanks for the info!