How do you pass data between sibling components?

React refs, context and custom hooks · Freshers and experienced

Model answer

Lift the state to their common parent and pass the value and a setter down as props. If the components are far apart, use Context or a state library. For one-off cases like "focus that input," a parent can hold a ref.

Avoid trying to make siblings talk directly: React's data flow goes through the tree.

Learn this topic

React Context API Explained: Share Data Without Passing Props in the course React.js Full Course: Beginner to Advanced.

Sign in to add your own answer.

More questions

• What is useRef used for?
• What is Context and when would you use it?
• What is a custom hook?
• What is forwardRef and how does it change in React 19?
• What is the difference between useRef and useState?
• How can Context cause performance problems, and how do you reduce them?