Using Render Props to Pass in Components With Typescript & React

Eric Semeniuc

Eric Semeniuc

March 27, 2020

In React and Typescript it’s sometimes tricky to pass in a component as a prop. We do that using React.FunctionComponent or React.FC as a shorthand.

React.FC

React.FC uses a type parameter for props, eg. use React.FC or React.FC<> when no parameters are needed, and React.FC<{ paramName1: string, paramName2: int}> for a functional component which takes in 2 parameters of type string and int respectively.

CodeSandbox Example

Sandbox link: https://codesandbox.io/s/strange-snowflake-7x93r

Other notes

Environment: