我的頁面有一個導航欄和一個側邊欄。導航欄由主頁和博客組成博客將呈現(xiàn) BlogHome 組件，該組件將從 db 獲取鏈接，單擊任何鏈接將呈現(xiàn) BlogContent 組件。假設側邊欄列出了 Blog1、Blog2 和 Blog3。如果我單擊 Blog1，它會將 Blog1 的內容正確呈現(xiàn)到它的一側，但如果我再次單擊 Blog2，它只會更改 URL，而不是 Blog2 的內容。請看看我的代碼：導航欄.js      <Router>            <Container className="p-0" fluid={true}>                <Navbar className="border-bottom" bg="transparent" expand="lg">                    <Navbar.Brand>{global.config.appname}</Navbar.Brand>                    <Navbar.Toggle className="border-0" aria-controls="navbar-toggle" />                    <Navbar.Collapse id="navbar-toggle">                        <Nav className="ml-auto">                            <Link className="nav-link" to="/">Home</Link>                            <Link className="nav-link" to="/blogs/main">Blogs</Link>                            <Link className="nav-link" to="/contact">Contact</Link>                        </Nav>                    </Navbar.Collapse>                </Navbar>                </Container>                <Switch>                    <Route exact path="/" component={Home}></Route>                    <Route exact path="/blogs/main" component={BlogHome}></Route>                </Switch>            </Router>BlogHome.jsexport default class BlogHome extends Component {    constructor(props)    {        super(props);        this.state = { data: null,route:null };    }    componentDidMount = () => {        console.log("BlogHome");        BlogDataService.getAll().then(data => {            let data_temp = []            let cnt = 0;            for (let item of data.data) {                data_temp.push(                <MenuItem key={cnt++} icon={<FaBlog />}>                    <Link to={"/blogs/main/" + item.id}>{item.title}</Link>                </MenuItem>                );                            }            this.setState({ data: data_temp });        })    }