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

我使用的是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'))

根/部门工作正常，但没有根/部门/。根/部门/部门也不工作。我不知道为什么。

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

我看不出我的代码和文档中提供的示例有任何区别。

另一个奇怪的是，我没有警告：

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

我：

Uncaught SyntaxError: Unexpected token <  bundle.js:2

如果我点击bundle.js在Chrome开发人员工具链接我到达index.html（但bundle.js是选项卡的名称）。

如/，出发地和目标的基本路线工作正常。

我有点卡在这个。任何意见将是有益的。

Full code available here：https://github.com/codeforabq/Open-Budget-ABQ/tree/dev
谢谢。

来源

2016-01-13 user2705463

你可以创建一个问题的一小版本小提琴？ –

我看了一下你的代码并启动了一个服务器，问题没有反应（还）。它位于server.js和/或您的url中的路由规则中。您正在获取语法错误，因为它试图查找/ dist/department中不存在的bundle.js。我正在玩一些东西，当我开始工作时我会发表评论。 –

您在index.html中的资产URL必须是绝对的。在index.html中，将斜线添加到所有链接href的开头，并添加到脚本src的开头。 –

'root/departments/department'将不起作用。

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

如果您希望允许“根/部门/部门”生成结果，那么您必须将“部门”作为“部门”的子项目。

对于您有如下所述，以得到路径：

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

来源

2016-01-13 06:50:26

您的解决方案无法使用。 – user2705463

我犯了一个小错误。只需将部门路径指定为“/部门”而不是“/”。 –

感谢克里斯哈迪您对绝对链接帮助。这是我的问题的解决方案。

用/为绝对前缀URL后。我结束了：

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

为和http://localhost:3000/departments/department

不是非常有帮助。

我试过PHP服务器（PHP -S本地主机：3000）和我：

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

因此，在应用程序。JSX我解决这个问题行：

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

到：

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

现在，它完美的作品！参数现在也可以工作。

非常感谢！

来源

2016-01-13 22:39:15 user2705463

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

回答

相关问题