Reactjs 如何使用React路由器调用组件内部的组件

我正在使用React、MobX状态树和React路由器创建一个简单的网站

基本上，站点的每个页面（第1页、第2页和第3页）都必须包含一个针对桌面和移动设备的不同菜单

这是我的结构：

index.tsx：

import React from 'react'
import ReactDOM from 'react-dom'
import { Provider } from 'mobx-react'
import { Router } from 'react-router'
import { State } from './states'
import { Routes } from './Routes'
import { history } from './states/index'

function renderApp() {
  ReactDOM.render(
    <Provider state={State}>
      <Router history={history}>
        <Routes />
      </Router>
    </Provider>,
    document.getElementById('root')
  )
}

但是我没有路由器

我需要帮助。非常感谢

考虑一下：

function withHeaderAndMenu(Component: React.ComponentClass) {
  return class WithHeaderAndMenu extends React.Component {
    render() {
      return (
        <div className="flex flex-column w-100 h-100">
          <Header />
          <WithMenu />
          <Component />
        </div>
      )
    }
  }
}

带有HeaderAndMenu的函数（组件：React.ComponentClass）{ 返回类的headerAndMenu扩展了React.Component{ render（）{ 返回( ) } } } 以及：

考虑一下：

function withHeaderAndMenu(Component: React.ComponentClass) {
  return class WithHeaderAndMenu extends React.Component {
    render() {
      return (
        <div className="flex flex-column w-100 h-100">
          <Header />
          <WithMenu />
          <Component />
        </div>
      )
    }
  }
}

带有HeaderAndMenu的函数（组件：React.ComponentClass）{ 返回类的headerAndMenu扩展了React.Component{ render（）{ 返回( ) } } } 以及：

可以使用此-@ravibagul91，谢谢，但是你能用我的代码添加一个工作示例吗？可以使用此-@ravibagul91，谢谢，但是你能用我的代码添加一个工作示例吗？

function withHeaderAndMenu(Component: React.ComponentClass) {
  return class WithHeaderAndMenu extends React.Component {
    render() {
      return (
        <div className="flex flex-column w-100 h-100">
          <Header />
          <WithMenu />
          <Component />
        </div>
      )
    }
  }
}

      <Route path={path} exact component={withHeaderAndMenu(Page1)} />
      <Route path={path} exact component={withHeaderAndMenu(Page2)} />
      <Route path={path} exact component={withHeaderAndMenu(Page3)} />