反应路由器路由但显示错误消息答案

【问题标题】：React Router routes but show error message反应路由器路由但显示错误消息
【发布时间】：2015-09-22 06:52:53
【问题描述】：

我正在使用 react 路由器 1.0.0-rc1 和 redux。

这是路线：

<Route path=""component={Body}>
    <Route path="machines/:id" component={SingleMachineView}/>
    <IndexRoute component={Dashboard}/>
    <Route path="*" component={Dashboard}/>
</Route>

这是链接：

<Link to={`machines/${machine.machine_id}`}> 
  {machine.name} 
</Link>

这是路由器的启动方式：

class Root extends React.Component {

  render() {

    const history = createHashHistory();

    return (
      <Provider store={store}>
        {() => <Router history={history} children={Routes}/>}
      </Provider>
    );
  }
}

ReactDOM.render(<Root/>, document.getElementById('app'));

一切都按预期工作，但是当我单击链接并呈现新视图时，我仍然在控制台中收到一条错误消息：

Warning: Location "machines/id2" did not match any routes

当我使用路径localhost:8080/#/machines/id2加载应用程序时，也不会出现错误消息

【问题讨论】：

点击Link时浏览器中的确切网址是什么？
http://localhost:8080/#/machines/id0?_k=cjqdch，顺便说一句，我不知道?_k=cjqdch 来自哪里。
@AndreasKöberle what is ?_k=cdjk
不知道，有些东西会自动将其添加到 url 的末尾。还以为是路由器发出来的。
似乎history模块添加了这个，当使用hashHistory时：rackt.github.io/history/stable/HashHistoryCaveats.html

标签： reactjs react-router

【解决方案1】：

问题在于链接以/开头：

<Link to={`/machines/${machine.machine_id}`}> 
  {machine.name} 
</Link>

【讨论】：

【解决方案2】：

在我使用路由器时，无论是路由器还是浏览器都会添加一个前导 /，就像您在 cmets 中的示例一样。

我建议您使用 / 而不是空白字符串来创建根 route：

<Route path="/"component={Body}>
    <Route path="machines/:id" component={SingleMachineView}/>
    <IndexRoute component={Dashboard}/>
    <Route path="*" component={Dashboard}/>
</Route>

【讨论】：

我不明白的是错误与url不匹配:(