javascript - React-router 与有效路由不匹配

Question

无论我做什么，我都无法让这个 react 路由器匹配路径的第二部分。

Express 服务器正在为任何 URL 匹配返回 index.html(我没有在任何 URL 上收到 GET 错误，所以我认为这没问题)

app.get('/*', (req, res) => {
  res.sendFile(path.join(__dirname, 'index.html'));
});

这里是我尝试过的一些路由示例，根据react router docs，这些应该是有效的规则。

示例 1)

<Route path="test">
  <IndexRoute component={Home} />
  <Route path="/login" component={Login} />
</Route>

或者

<Route path="test">
    <IndexRoute component={Home} />
    <Route path="/login" component={Login} />
</Route>

http://localhost:3100/test = 成功 > 返回主页组件 http://localhost:3100/test/login = 失败 > 给我空白屏幕

示例 2)

 <Route path="/login" component={Login} />

http://localhost:3100/login = 成功 > 返回登录组件

示例 3)

 <Route path="/test/login" component={Login} />

或者

 <Route path="test/login" component={Login} />

http://localhost:3100/test/login = 失败 > 给我空白屏幕

我使用的是 2.5 版本，任何帮助将不胜感激!

** React 路由器的 yarn 转储 **

react-router@^2.5.0:
  version "2.8.1"
  resolved "https://registry.yarnpkg.com/react-router/-/react-router-2.8.1.tgz#73e9491f6ceb316d0f779829081863e378ee4ed7"
  dependencies:
    history "^2.1.2"
    hoist-non-react-statics "^1.2.0"
    invariant "^2.2.1"
    loose-envify "^1.2.0"
    warning "^3.0.0"

Answer 1

尝试 path="login" 而不是 path="/login" 。嵌套路由中不需要路径前的斜杠。

<Route path="test/">
  <IndexRoute component={Home} />
  <Route path="login" component={Login} />
</Route>