Javascript 如何使用React Router在嵌套组件之间移动

我一直与react router合作得很好，直到我不得不尝试嵌套组件并让导航栏显示路径。例如，我想从我的匹配页面转到公文包页面，然后我希望url反映这一点（……/#/matches/portfolio）

对我来说，这些文档似乎解释了如何做到这一点，但是我只能更改url，而不能更改页面内容。不显示任何错误，只注意视图发生的情况

这是我的路由器，包含嵌套路由：

ReactDOM.render(
  <Router history={hashHistory}>
    <Route path="/" component={App}>
      <Route path="login" component={Login} />
      <Route path="home" component={Home} />
      <Route path="matches" component={Matches}>
        <Route path="portfolio" component={Portfolio}>
          <Route path="search" component={Search} />
        </Route>
      </Route>
      <Route path="create" component={Create} />
      <Route path="join" component={Join}/>
    </Route>
  </Router>
, document.getElementById('app'));

ReactDOM.render(
，document.getElementById（'app'）；

如果我在matches页面上，想链接到一个公文包，我有一个按钮：

<Link to="matches/portfolio">To Portfolio</Link>

到公文包

（理想情况下，我希望在url上附加一个portfolioId，但目前我正在努力保持简单）

回购协议可在此处找到： 然后，主路由器位于server/client/src/app.jsx中，所有组件位于server/client/src/components中。

---

要查看运行nodemon server.js和webpack的项目，下面是我如何获得工作路线的。这不是说什么，但它的工作

ReactDOM.render(
  <Router history={hashHistory}>
   <Route path="/" component={App}>
     <Route path="/login" component={Login} />
     <Route path="/home" component={Home} />
     <Route path="/join" component={Join}/>
     <Route path="/matches" component={Matches} />
     <Route path="/matches/portfolio" component={Portfolio} />
     <Route path="/matches/portfolio/search" component={Search} />
    <Route path="create" component={Create} />
  </Route>
</Router>
, document.getElementById('app'));

ReactDOM.render(
，document.getElementById（'app'）；

然后按以下步骤进行布线：

<Link to="/matches/portfolio">To Portfolio</Link>

到公文包

以下是我如何获得工作路线的。这不是说什么，但它的工作

ReactDOM.render(
  <Router history={hashHistory}>
   <Route path="/" component={App}>
     <Route path="/login" component={Login} />
     <Route path="/home" component={Home} />
     <Route path="/join" component={Join}/>
     <Route path="/matches" component={Matches} />
     <Route path="/matches/portfolio" component={Portfolio} />
     <Route path="/matches/portfolio/search" component={Search} />
    <Route path="create" component={Create} />
  </Route>
</Router>
, document.getElementById('app'));

ReactDOM.render(
，document.getElementById（'app'）；

然后按以下步骤进行布线：

<Link to="/matches/portfolio">To Portfolio</Link>

到公文包