use react and antd as the background management system. Click on the left navigation, and there will be changes on the right. How to use router4 to write the jump in the left navigation

for example, if I click on the right side of platform management, there will be a table

clicking on the right side of model management will turn into a chart

<div>
        <header className="header">
          ReactManager
        </header>
        <main className="main">
          <div className="menu">
            <div>
              123
            </div>
            <Menu mode="inline" theme="dark" style={{width: "240px"}}>
              <SubMenu key="user" title={<span><Icon type="user"/><span>OTA</span></span>}>
                <MenuItem key="platform-manage">
                  
                </MenuItem>
                <MenuItem key="car-manage">
                  
                </MenuItem>
                <MenuItem key="device-manage">
                  
                </MenuItem>
                <SubMenu key="introduce-manage" title="">
                  <Menu.Item key="10"></Menu.Item>
                  <Menu.Item key="11"></Menu.Item>
                  <Menu.Item key="12"></Menu.Item>
                </SubMenu>
                <SubMenu key="count-manage" title="">
                  <Menu.Item key="15"></Menu.Item>
                </SubMenu>
              </SubMenu>
              <SubMenu key="book" title={<span><Icon type="book"/><span></span></span>}>
                <MenuItem key="book-list">
                  
                </MenuItem>
                <MenuItem key="book-add">
                  
                </MenuItem>
              </SubMenu>
            </Menu>
          </div>
          <div className="content">
            <Device />
          </div>
        </main>
      </div>