javascript - React 路由器不是渲染组件。已经尝试了所有解决方案，没有任何效果

Question

这是我路由路径的地方，它会更改 url 但不会呈现组件。我已经尝试了从 this.props.children 到使用“精确”的所有方法，但似乎没有任何效果。请帮忙

function Body() {
    const [{artist,artistAlbum}, dispatch] = DataLayerValue();
    console.log(artist);
    console.log(artistAlbum);
    
    return (
        <div className="body">
            <div className="header">
                <Header />
            </div>

            <Router>
                <div className="content">
                    <Switch>
                        <Route exact path="/"component={withRouter(Home)} />
                        <Route exact path="/harrdyx"component={withRouter(HarrdyPage)} />
                    </Switch>
                </div>
            </Router>
        </div>
    );
}

export default Body

这是坚硬的身体

return (
    <div>
        <Link to="/harrdyx">
        <StyledButton>Harrdy</StyledButton>
        </Link>
    </div>
)

这是应该渲染的组件

function HarrdyPage(props) {
    const [{artist,artistAlbum},dispatch]=DataLayerValue();
       
    return (
        <div className="Harrdy-Sandhu">
            <div className="title-img">
                <div className="naam">Harrdy Sandhu</div>
                <div>
                    <img className="hlog" src={hh} alt="Harrdy_img"/>
                </div>
            </div>

            <div className="playH">
                <PlayCircleFilledIcon fontSize="large"  />
            </div>
            {this.props.children}
        </div>
    )
}
    
export default HarrdyPage;

标签： javascriptreactjsreact-routerreact-router-dom