April 2018
Intermediate to advanced
298 pages
6h 34m
English
For some components, it makes no sense to have more than one child. For these cases, you would use the React.Element type instead of the React.ChildrenArray type:
// @flow
import * as React from 'react';
import Child from './Child';
type Props = {
children: React.Element<Child>,
};
const ParentWithOneChild = ({ children }: Props) => (
<section>
<h2>Parent With One Child</h2>
{children}
</section>
);
export default ParentWithOneChild;
As with the example before this one, you can still specify the type of child component that is allowed. In this case, the child component is called Child, imported from './Child'. Here's how you would pass this component a child component:
<ParentWithOneChild> <Child /> </ParentWithOneChild> ...