Question

我使用的是React 0.14.0，React Router 2.0.0-rc4，browserify 11.2.0，babelify 7.2.0。

这是我的路由器代码：

render((
<Router history={browserHistory}>
  <Route path="/" component={App}>
    <IndexRoute component={Departments} />
    <Route path="goals" component={Goals} />
    <Route path="departments" component={Departments} >
      <Route path="department" component={Department} />
    </Route>
  </Route>
</Router>
), document.getElementById('react-container'))

root / departments工作正常但不是root / departments /。根/部门/部门既不工作也不工作。我不知道为什么。

此外，似乎任何类型的参数：myParam都无法识别。

我无法看到我的代码与文档中提供的示例之间存在任何差异。

另一个奇怪的事情是我没有发出警告：

Warning: [react-router] Location "undefined" did not match any routes

我有：

Uncaught SyntaxError: Unexpected token <        bundle.js:2

如果我点击chrome的开发工具中的bundle.js链接，我会到达index.html（但是bundle.js是标签的名称）。

/，部门和目标等基本路线可以正常工作。

我有点坚持这个。任何意见将是有益的。

此处提供完整代码：https://github.com/codeforabq/Open-Budget-ABQ/tree/dev
感谢。

Answer 1

'root / departments / department'将无效。

这背后的原因是 - 部门不是'部门'的孩子。它只是'App'组件的孩子。

如果你想让'root / departments / department'产生结果，那么你必须把'部门'作为'部门'的孩子。

为此你必须提供如下所述的路径：

<Router history={browserHistory}>
  <Route path="/" component={Departments}>
    <IndexRoute component={Goals} />
      <Route path="department" component={Department} />
    </Route>
  </Route>
</Router>

Answer 2

感谢Kris Hardy对绝对链接的帮助。这是解决我问题的方法。

在URL前面添加/为绝对值。我最终得到了：

Error: Invalid value for <path> attribute d="M2.4492935982947065e-15,-40A40,40 0 1,1 NaN,NaNL0,0Z"

代表http://localhost:3000/departments/和http://localhost:3000/departments/department

不是很有帮助。

我尝试了php服务器（php -S localhost：3000），我得到了：

GET http://localhost:3000/departments/app/data/budget-first-test.tsv 404 (Not Found)
Uncaught #<XMLHttpRequest>

所以在app.jsx中我修复了这一行：

var dataPath = 'app/data/budget-first-test.tsv';

为：

var dataPath = '/app/data/budget-first-test.tsv';

现在它完美无缺！参数现在也可以使用。

非常感谢！

反应路由器尾随斜杠不起作用

2 个答案: