Reactjs 如何将React HOC与Typescript一起使用

我是Typescript新手，我想使用React HOC（高阶组件）。我需要使用函数intlWrapper将每个组件包装到名为IntlContext的提供程序上下文。我的代码：

import * as React from 'react';
import * as _ from 'lodash';
import  {IntlContext} from '../intl';
export default function intlWrapper <T> (WrappedComponent: React.ComponentClass<T>){
  return class IntlReceiver extends React.Component <T>{
    render() {
      return (
        <IntlContext.Consumer>
          {
            locale=><WrappedComponent {...this.props} locale={locale}/>
          }
        </IntlContext.Consumer>
      )
    }
  }
}

import*as React from'React'；
从“lodash”导入*as uuu；
从“../intl”导入{IntlContext}；
导出默认函数intlWrapper（WrappedComponent:React.ComponentClass）{
返回类IntlReceiver扩展React.Component{
render（）{
返回(
{
地区=>
}
)
}
}
}

但我犯了一个康普利错误

(10,55): Property 'locale' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<T, any, any>> & Readonly<{ children?: ReactNode; }> & Readonly<T>'.

（10,55）：类型“IntrinsicatAttributes&IntrinsicClassAttributes&Readonly&Readonly”上不存在属性“locale”。

如果我改为any，代码就会工作。但当我使用WrappedComponent时，接口中定义的PropTypes会丢失，因为它被包装了。

---

这个问题有什么解决方案吗？

您有

WrappedComponent:React.ComponentClass

不能保证component类使用

locale

属性

您可以通过添加它来确保，例如

WrappedComponent:React.ComponentClass

等