Menu
I have written this code in several other components but can't seem to understand why this isn't working.
{ this.props.children.map(function(child) { return <li>{child}</li> }) } Any help would be greatly appreciated!
282
React. Children. map is a utility function to help you handle different cases. Invokes a function on every immediate child contained within children with this set to thisArg.
The React children prop is an important concept for creating reusable components because it allows components to be constructed together. However, a common issue with using React with Typescript is figuring out which data type to use with React children since Typescript is a strongly typed library.
What are children? The children, in React, refer to the generic box whose contents are unknown until they're passed from the parent component. What does this mean? It simply means that the component will display whatever is included in between the opening and closing tags while invoking the component.
this.props.children is an opaque data structure. It can be either an array or a single element. In your case, this.props.children is probably a single element, which is why the .map() method is undefined.
You should use the React.Children API when manipulating the children prop.
See also Type of the Children props.
71
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
