React + Typescript +动态导入HOC类型

Question

console.log(this.props.data.startDate);
var jsonWeek = moment(this.props.data.startDate, "W");

我想添加以下类型：

  

importComponent：任意 <=不得为

一切正常，但是import React from 'react' import { Preloader } from 'src/base-components/preloader' import styles from './styles.scss' const withLazyLoading = (importComponent: any) => { return class extends React.Component { public state = { component: null } public componentDidMount() { importComponent() .then((cmp) => { this.setState({ component: cmp.default }) }) } public render() { const Component = this.state.component return Component ? <Component { ...this.props } /> : <div className={ styles.box }><Preloader show /></div> } } } export { withLazyLoading } 会导致错误：

Answer 1

给出importComponent是一个函数，它返回组件的 promise ，它是：

const withLazyLoading = (importComponent: () => Promise<React.ComponentClass>) => {
...

如果需要，还可以将其键入通用名称：

const withLazyLoading = <T extends {}>(importComponent: () => Promise<React.ComponentClass<T>>): React.ComponentClass<T> => {
    return class extends React.Component<T> {
    ...