@ikevin127
better ways: - lift state up (parent only) and pass through props - wrap children with forwardRef, and controll it from parent
@hasanalshareef5047
1- i use function call On parent calling expect props by children 2- use Context 3- redux
@travelspurs
It's so tough. C++ Java were easy back in our times!
@assuraworkwalker9640
I think that calling this child component Callback is not the best Idea, evenmore in an interview context. Because Callback is a concept and components should not be named as concepts. The sub component that takes a function as a prop could be named as <ColorNameInput updateColor={updateColor} /> in my opinion this is more obvious than Callback... As a recruiter I will also expect from candidate to be conscious of the naming aspect because this is often a negliged aspect. Of course you're right this question of props drilling up and down is important. :) My coment is only my opinion.
@MVSBAND
Another solution is just passing the setUIcolor into child and set the color in handleChange… :)
@saxtonvasquez9519
Context is the best thing to use for react state management. You would set the state in a provider file which will be used as a component to wrap your entire project (or everything it’s relevant to) and then you import what you need into the child components including values and functions
@ambupadamuduli3794
Thanks Sandip. It's really helpful . Want more shorts like this
@dutchbozo
As a senior dev, the fact that this has so many likes scares me for future React codebases I might have to work on..
@mahmudrashid492
why don't we use state lifting ?? we can create a function on the parent component to do all the stuff and pass it to the child component , and just use that in onChange event in the input
@allinone_747
You can directly use useRef in parent and send it to child through prop....and use ref in input box....you will get current value of box through ref in parent ryt??
@RaviGILL-s1f
That’s masterpiece, never thought about it . Thanks sir ❤
@sshmyg
Make component controlled or uncontrolled, don’t mix it. And you will thank you to yourself in the future.
@cognitivebubble4272
Wish you more of strength! For making react Interviewee's life easier
@prashantparmar2217
Its not a callback function. You can refer it as a pointer at a function with arguments to be passed into
@maneshwam
You don't need the state in th child component, and for setting the color in parent, you. can skip string interpolation and set the color variable "UIcolor" directly
@mindbodyps
Question should be how you will send data from child to parents without shifting the state from child to parents and the answer is there are multiple ways. 1. You can create a global state for which you can use redux toolkit, or redux by creating a slice and declaration a global state there and in whatever compound you want to use it you can use useSelector to select the state and useDispatch to dispatch the changes to global state created inside the slice
@percyvalmasuku
How does a getColor function set a color. The naming conventions here are way off.
@Charles-d5g8g
If you want, you can avoid the useState all together in the child component and just pass the data back directly.
@fullmetaltheorist
Sinple yet effective. You are smart.
@coder0015