Flow definition
declare type ReactComponent<Props> = Class<React$Component<void, Props, *>> | (props: Props) => React$Element<*>;
Title component
import React from 'react';
import Helmet from 'react-helmet';
import withStyles from 'isomorphic-style-loader/lib/withStyles';
import styles from './Title.css';
type Props = {
title: string,
subTitle?: string,
};
function Title({ title, subTitle }: Props) {
return (
<section>
<Helmet title={title} />
<h1>{title}</h1>
{subTitle && <h2>{subTitle}</h2>}
</section>
);
}
export default (withStyles(styles)(Title): ReactComponent<Props>);
So, now we have the Title component, which takes two details, both lines, and one of them is optional.
Then I will try to use the above component in another component.
import React from 'react';
import withStyles from 'isomorphic-style-loader/lib/withStyles';
import styles from './TextureDetail.css';
import Title from '../../Title';
type Props = {
postData: Map<*, *>,
postTags: Array<*>,
};
function TextureDetail() {
return (
<div>
<Title />
</div>
);
}
export default (withStyles(styles)(TextureDetail): ReactComponent<Props>);
In this case, I expect the thread to consider that I am using the Title component without the necessary details, but it does not. How to set up a stream, which it actually checks for the required types.
source
share