流量路由器参数路由

我实际上正在使用Fuxible和Reactjs开发一个应用程序，并且遇到问题。流量路由器参数路由

事实上，我需要在./configs/routes.js中创建一个不在顶部菜单栏中的路线。

我需要这条路线可以通过参数来访问：id。

这里有一个标准的路线，我使用：

detail: { 
     path: '/product/1/details', 
     method: 'get', 
     page: 'productDetail', 
     title: 'product detail', 
     handler: require('../components/product/ProductDetail') 
    }

我需要的是让这样的：

detail: { 
      path: '/product/:id/details', 
      method: 'get', 
      page: 'productDetail', 
      title: 'product detail', 
      handler: require('../components/product/ProductDetail') 
     }

，但没有将其添加到他的顶部导航栏中的菜单（即是自动的生成通俗易懂）

其实，我有这样一个事实：我在URL中发现了一个奇怪的错误，像这样：

NavLink没有HREF或无法解决的routeName '细节' 创建

我如何进行？

来源

2015-09-11 mfrachet

Fluxible根本不控制导航。生成器附带一个“导航”组件，默认情况下使用路由配置来生成导航，但您可以自由修改该组件以执行任何您想要的操作。我们通常喜欢将菜单配置与路由配置分开。例如，您可以查看我们的Fluxible.io源代码：https://github.com/yahoo/fluxible.io/blob/master/configs/menu.js

来源

2015-09-11 19:21:00

我已经看过你有什么链接，并且我已经理解了顶部导航栏由nav组件处理的事实。但是，这并没有帮助我做出我需要的工作。 – mfrachet

要快速修复，请为每个路径添加isSection属性，然后过滤导航组件中的链接。

//configs/routes.js 
about: { 
    path: '/about', 
    method: 'get', 
    page: 'about', 
    title: 'About', 
    handler: require('../components/About'), 
    isSection: true 
}, 
play: { 
    path: '/play/:id', 
    method: 'get', 
    page: 'play', 
    title: 'Play', 
    handler: require('../components/About'), 
    isSection: false 
} 

//components/Nav.js 
if (link.isSection){ 
      if (selected && selected.name === name) { 
       className = 'pure-menu-selected'; 
      } 
      return (
       <li className={className} key={link.path}> 
        <NavLink routeName={link.page} activeStyle={{backgroundColor: '#eee'}}>{link.title}</NavLink> 
       </li> 
      ); 
     }

来源

2016-06-14 22:19:31 tmt

流量路由器参数路由

回答

相关问题