Reactjs JSX元素类型'；CommonHeader'；没有任何构造或调用签名

我正在尝试在我的react应用程序中组合多个HOC：

基本上：

const { Header } = Layout;

interface CommonHeaderProps extends RouteComponentProps<any> {
  t: Function
}

class CommonHeader extends React.Component<CommonHeaderProps> {  

  render() {


    return (
      <div>     
      </div>
    );
  }
}

const mapStateToProps = (state: RootState) => ({
})

const mapDispatchToProps = {
};

const Component = connect(
  mapStateToProps,
  mapDispatchToProps
)(CommonHeader)

export default compose<CommonHeader>(
 withTranslation,
 withRouter,
)(Component)

const{Header}=Layout；
接口CommonHeaderProps扩展了RouteComponentProps{
t:功能
}
类CommonHeader扩展了React.Component{
render（）{
返回(
);
}
}
常量mapStateToProps=（状态：RootState）=>({
})
const mapDispatchToProps={
};
常量组件=连接(
MapStateTops，
mapDispatchToProps
)（通用标题）
导出默认组合(
在翻译方面，
用路由器，
)（组成部分）

我面临的问题是，当我试图在渲染器函数中从另一个组件调用此组件时，出现以下错误

---

JSX元素类型“CommonHeader”没有任何构造或调用签名。

这是否回答了您的问题？我看到了那个帖子，我可以理解这个问题，但我不知道如何解决我的情况