We are going to start refactoring our CountDisplay
component. It is a small stateless component but it has a few props that can benefit from type safety.
There are three ways to type a component, inline, alias, and as a function expression. The inline typing adds a bit of noise to our code and can make it difficult to parse right out of the gate. To fix this, we use a type alias that reads a little bit nicer. To add in a function expression, which we get from the React Types that we downloaded, we can declare this variable to have a type of React.FunctionComponent
which takes as a type argument, our props.
I finally know what React.VFC means ๐ Thank you Chance! ๐
Update: VoidFunctionComponent
is now equivalent with FunctionComponent
. Details here.