在路由器上下文之外呈现的链接无法处理点击

Question

我收到此错误：

  

在路由器上下文之外呈现的链接无法处理点击

<{1}}标记上的

，无法找出原因。

<Link>

Answer 1

您并未真正正确使用React Router，您需要呈现<Router>组件，并在<Router>内部呈现您的路由（<Route>组件）。

你需要这样的东西：

ReactDOM.render(
    <Router history={browserHistory}>
        <Route path="/" component={App}>
            <Route path="my-path" component={MyPath} />
        </Route>
    </Router>

由于您并未真正呈现<Router>，因此React Router会抛出此错误。

您可以在此处查看更多信息：

https://github.com/reactjs/react-router-tutorial/tree/f97d0b7e1ff572aa6711fe29b54e6b8fdf9efddf/lessons/02-rendering-a-route#rendering-a-route

Answer 2

这篇文章有点陈旧，我来这里有点晚了，也许下面的发现可以帮助别人。

如果由于路由器组件外部的链接导致测试失败，请查看MemoryRouter以测试链接组件。

这是一个链接，供人们在单元测试中测试道具和东西：

• https://github.com/ReactTraining/react-router/blob/master/packages/react-router-dom/modules/tests/Link-test.js

const node = document.createElement("div");
ReactDOM.render(
  <MemoryRouter>
    <Link to="/" innerRef={refCallback}>link</Link>
  </MemoryRouter>,
  node
)