Menu
According to ESLINT rule no-children-prop
When using JSX, the children should be nested between the opening and closing tags. When not using JSX, the children should be passed as additional arguments to React.createElement
Is this just a style suggestion, or can real damage arise?
731
As said, there is no way passing props from a child to a parent component. But you can always pass functions from parent to child components, whereas the child components make use of these functions and the functions may change the state in a parent component above.
children is a special prop, automatically passed to every component, that can be used to render the content included between the opening and closing tags when invoking a component.
Children are props If you want to pass things to this button, you would use a prop. If you want to make our button say more than just "I am a button," you can pass children to it. By passing children in this way, you are passing it to the component by position.
To pass data from a child component to its parent, we can call a parent function from the child component with arguments. The parent function can be passed down to the child as a prop, and the function arguments are the data that the parent will receive.
It seems to be more of a stylistic suggestion and also prevents you from shooting yourself in the foot.
If you had a component:
<Component children="foo">bar</Component>
and in the component do
return (
<div>
{this.props.children}
</div>
)
you would end up getting bar as this.props.children instead of foo but as far as this breaking anything in react or causing "damage"
I have found no evidence of such and there is a lengthy discussions here https://github.com/airbnb/javascript/issues/1089#issuecomment-250640742
stating the same.
113
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