Menu
React 0.13 brings parent-based context instead of owner-based context.
So, i can't quite understand the difference between owner and parent components. Examples will be appreciated.
287
In React parent components can communicate to child components using a special property defined by React called as Props. All the components in React will be having this property defined by default which will hold all the properties as key value pairs that are sent from the parent component.
In the parent component, create a callback function. This callback function will retrieve the data from the child component. Pass the callback function to the child as a props from the parent component. The child component calls the parent callback function using props and passes the data to the parent component.
React components are independent and reusable code. They are the building blocks of any React application. Components serve the same purpose as JavaScript functions, but work individually to return JSX code as elements for our UI.
You can't pass props from child to parent in React, it's only one way (from parent to child). You should either: Put the state in the parent component and manipulate it from the child component by passing the setter function in the props.
var A = React.createClass({
render() {
return (
<B>
<C />
</B>
);
}
});
In the above example, A is the owner of B and C, because A creates both of the components.
However, B is the parent of C because C is passed as child to B.
More information can be found in the documentation.
It's important to draw a distinction between the owner-ownee relationship and the parent-child relationship. The owner-ownee relationship is specific to React, while the parent-child relationship is simply the one you know and love from the DOM.
85
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
