reactjs - React Router 使用 TransitionGroup 抛出重定向警告

Question

我正在使用 React Router 和 React Transition Group 在路由之间设置动画。我使用 <Redirect /> 时遇到问题成分。该应用程序可以运行，但我从 React Router 收到多个警告，内容如下:

Warning: You tried to redirect to the same route you're currently on: "/"

你可以在 Code Sandbox 中看到它发生的情况。确保打开沙箱控制台，然后输入错误的路径(例如codesandbox.io/abc)。

我尝试按照他们在文档中给出的示例( https://reacttraining.com/react-router/web/example/animated-transitions )进行操作，但这不包括重定向。有没有更好的方法使用重定向和转换来避免警告？

Answer 1

当 <Redirect> 时会出现此问题安装在动画组件内。

而不是将动画组件包裹在 <Switch> 周围，包裹 <Route>的子组件。 (您可能需要使用 <Route> 的 render 属性及其 component 属性。)

这种方法无需传递 location支持<Switch> -- 相反每个 <CSSTransition/>引用文献location .

参见示例:https://codesandbox.io/s/nn5r595joj