2016-10-06 108 views
0

深层链接使用下面的路由配置 -添加使用反应路由器

<Router history={hashHistory}> 
    <Route name="Home" path="/" component={BaseLayout}> 
     <Route name="Gateways" path="/gateways" component={DashboardLayout}> 
     <Route name="Login" path="/login" component={Login}/>      
     <Route name=":id" path="/gateways/:id"> 
      <IndexRoute name="Dashboard" component={ViewGateWay}/>         
      <Route name="Access Points" path="/accesspoints" component={AccessPoints}>        
       <Route name=":id" path="/:id" component={ViewAccessPoint}/> 
      </Route> 
      <Route name="Devices" path="/devices" component={Devices}>        
       <Route name=":id" path="/:id" component={ViewDevice}/> 
      </Route> 
     </Route> 
     <IndexRoute component={Gateways} /> 
    </Route>      
    <IndexRedirect to="Login" /> 
    </Route> 
</Router> 

在路径使用name的面包屑。有一个链接到/gateways/:id/gateways/:id/devices,/gateways/:id/accesspoints的侧面菜单,最后两个链接到单个设备和接入点,使用Link作为/gateways/:id/devices/:id/gateways/:id/accesspoints/:id。当我给在侧菜单中的链接作为

<Link to="/gateways/${this.props.params.id}/accesspoints">Access Points</Link> 

OR

<Link to="/accesspoints">Access Points</Link> 

,我没有得到正确的页面。设备链接也一样。我正在尝试与面包屑一起实现下面的API。

home/gateways/GW_ID1/dashboard 
home/gateways/GW_ID1/accesspoints 
home/gateways/GW_ID1/accesspoints/GW_AP1 
home/gateways/GW_ID1/devices 
home/gateways/GW_ID1/devices/GW_DV1 

什么是链接的正确方法?不使用任何处理程序。

回答

0

有点头脑风暴后,想出了一个解决办法是什么我想实现

<Route name=":gid" path="/gateways/:gid"> 
     <Route name="Dashboard" path="/gateways/:gid/dashboard" component={ViewGateWay}/>          
     <Route name="Access Points" path="/gateways/:gid/accesspoints" component={AccessPoints}>        
      <Route name=":apid" path="/gateways/:gid/accesspoints/:apid" component={ViewAccessPoint}/> 
     </Route> 
     <Route name="Devices" path="/gateways/:gid/devices" component={Devices}>        
       <Route name=":did" path="/gateways/:gid/devices/:did" component={ViewDevice}/> 
     </Route> 
</Route>