React + Typescript: Type of React component with no state/no props
As answered for this question, you can use the React.FC<{}>
class
const MyStatelessComponent : React.FC<{}> = props =>
<div>{props.children}</div>
Or if your markup gets bigger:
const MyStatelessComponent : React.FC<{}> = props => {
{/* Some code here */}
return <div>{props.children}</div>
}
According to this guideline and my exp, I would say :
class Foo extends React.Component<null, null> {}
when you know you will not recieve props nor stateclass Foo extends React.Component<any, any> {}
when you know you will recieve props and state but you really don't care what they look likeclass Foo extends React.Component<{}, {}> {}
never saw, seems strangeclass Foo extends React.Component<undefined, undefined> {}
same asnull
, it's up to you. I see more oftennull
thanundefined
class Foo extends React.Component<void, void> {}
bad idea, since seems to be reserved for functions return (when you do not expect one)
Other opinions are welcomed
From https://github.com/DefinitelyTyped/DefinitelyTyped/blob/15b7bac31972fbc081028937dfb1487507ca5fc9/types/react/index.d.ts#L199-L200
interface Component<P = {}, S = {}> extends ComponentLifecycle<P, S> { }
Props and state are initialised to {}
, so for a component with no state nor prop we can simply do:
class Foo extends React.Component {}