Question

我正在尝试使用我的React路由器制作可选的子路由，但无论我搜索什么，我都无法找到适合我的解决方案！

我尝试了这个答案中提到的每个解决方案： React Router with optional path parameter - 没什么用。

所以我在一个文件中有以下内容：

render(
  <Provider store={store}>
    <Router history={browserHistory} routes={routes} />
  </Provider> , document.getElementById('app')
  );

然后：

 export default (
   <Router history={browserHistory}>
     <Route path={'/'} component ={ApplicationHomePageContainer}></Route>
     <Route path={'/home'} component ={UserHomePageContainer}></Route>
     <Route path={'/circle(/:path)'} component ={CirclePageContainer}></Route>
    </Router>
 )

我尝试了很多不同的方法，但无论我做什么，路线/circle/whatever都不会渲染任何东西。所有其他工作都很好。

我使用的是React路由器版本2.8.3，我尝试升级到版本3但是没有解决问题。

Answer 1

我不知道它是否好，但我就是这样做的：

<Router history={browserHistory}>
    <Route path={'/circle'} component ={CirclePageContainer}></Route>
    <Route path={'/circle/:path'} component ={CirclePageContainer}></Route>
</Router>

然后我让CirclePageContainer组件在没有参数时处理场景

Answer 2

我发现我做错了什么。

所以我在我的后端有这个：

server.get('/*', function(req, res, next) {
res.sendFile('index.html', { root: __dirname });
});

我只需要改变我的html文件夹：

<script src="/bundle.js"></script>

到

<script src="/bundle.js"></script>

使用React Router导航到可选参数

2 个答案: