code is as follows: I want to insert the content into the red box, but now I skip the page
import React from "react"
import Header from". / header/header"
import Sider from". / sider/sider";
import Content from". / content/content";
import {Route, Switch, Link} from "react-router-dom"
import {Menu, Icon, Button} from" antd";
const ProductList = function productList () {
return (
<div>this is ProductList</div>
)}
const ProductDetail = function productDetail () {
return (
<div>this is ProductDetail</div>
)}
class Dashboard extends React.Component {
render() {
return (
<div>
<div>
<Header />
</div>
<div className="container-fluid">
<div className="row">
<div className="col-lg-2">
<Menu
defaultSelectedKeys={["1"]}
defaultOpenKeys={["sub1"]}
mode="vertical"
theme="light"
>
<Menu.Item key="1">
<Link to={"/productList"}>
<Icon type="pie-chart" />
<span></span>
</Link>
</Menu.Item>
<Menu.Item key="2">
<Link to={"/productDetail"}>
<Icon type="pie-chart" />
<span></span>
</Link>
</Menu.Item>
</Menu>
</div>
<div className="col-lg-10">
<Route path="/productList" component={ProductList}></Route>
<Route path="/productDetail" component={ProductDetail}></Route>
</div>
</div>
</div>
</div>
)
}}
export default Dashboard
