I've been working with React for about 2 professional years but have never known about this until recent. Since I had a chance to apply this 'new' thing, I'm sharing now with you.
I was trying to fix a defect that I was so unsure about how to fix it with the current implementation. That is, some of the inner components were not working as expected.
1920 x 1080, 71.4 KB, JPG
The issue that I was facing is that the "Clear all" button cannot clear the state of the pop-up window (Category 2 filters).
It seems easy. Yes, but not. I'm dealing with an existing application with existing implementation that are now in production, and the current implementation doesn't function properly in this case. I cannot toss everything up.
So, I was thinking about an approach that whether it is possible or not to control the state of the pop-up window from parent.
Via a ref? This is very common.
Redux state, useContext? Maybe.
But I found another way from my friend - ChatGPT.
1920 x 1080, 69.7 KB, JPG
Ok, it may not be new to you, but it is truly something new to me after years working with React.
And it is used when we need to call child component's method (and variable - not recommended as the parent may receive old values - it won’t update reactively in the parent).
In programming, there may be more than one solution to an issue, the most common one is not always applicable and could be used. The way we do more, the way we learn more, that's what I believe.
And so grateful to be in the environment where we can actually learn something.