默认状态/链接与反应路由器

Question

我正在向个人资料组件添加导航，并且我正在使用BrowserRouter

主要应用

class App extends React.Component {
    render() {
        return (
            <Router>
                <Switch>
                    <Route path="/:username" exact={true} component={Profile} />
                </Switch>
            </Router>
        )
    }
}

个人资料模块

<article>
    <Router>
        <section>               
            <h1>{name}</h1>
            <nav>
                <NavLink to="/" activeClassName="active">Profile</NavLink>
                <NavLink to="/photos" activeClassName="active">Photos</NavLink>    
                </nav>                        
                <Switch>
                    <Route path="/" exact={true} how to just re render the default content on this page? />
                    <Route path="/photos" exact={true} render={() => (<Photos />)} />
                </Switch>
         </section>
    </Router>
</article>

“个人资料”标签/链接纯粹是为了当有人点击“照片”时，他们可以导航回那里的默认内容。

我希望它像Twitter一样，当您访问用户的个人资料时，Tweets链接默认突出显示在twitter.com/user上，而不是像twitter.com/user/tweets那样定义主要路线。

如何使用反应路由器做到这一点？

我在网上发现的大部分文档和这里的帖子都假设您正在构建一个包含路线的静态页面，而这感觉更像是路线中的路线。

另一件事是当点击/照片时，它会转到/照片而不是/ james /照片，即使网址是/詹姆斯。