Want to use children with React Stateless Functional Component in TypeScript? React 16.8 Update: Since React 16.8, the names React.SFC and React.StatelessComponent are deprecated. Actually, they have become aliases for React.FunctionComponent type or React.FC for short.
1 2 3 4 5 | const MyStatelessComponent : React.FunctionComponent<MyProps> = props => <div> <p>{props.propInMyProps}</p> <p>{props.children}</p> </div> |
For now, you can use the React.StatelessComponent<> type, as:
1 2 | const MyStatelessComponent : React.StatelessComponent<{}> = props => <div>{props.children}</div> |
For a component with your own custom props (like MyProps interface):
1 2 3 4 5 | const MyStatelessComponent : React.StatelessComponent<MyProps> = props => <div> <p>{props.propInMyProps}</p> <p>{props.children}</p> </div> |
If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.