微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

React ErrorBoundary - 如何在另一个路由组件中出错时路由到组件/主页

如何解决React ErrorBoundary - 如何在另一个路由组件中出错时路由到组件/主页

如果我在另一个带有路由 Age_n页面中出错,我试图弄清楚如何定向到我的主页 /。我能够重定向到我的主页,并将 ErrorBoundary 包裹在我的组件中,但路由没有改变,并且立即恢复到相同的错误。 (我基本上是想在出现错误显示主页)

我尝试在 ErrorBoundary 组件中使用 /results 和渲染函数,如下所示:

react-router-dom

但是再次出现错误,路线保持不变 render() { if (this.state.hasError) { return ( <Router> <Switch> <Route path="/" exact component={MyHomePage} /> </Switch> </Router>); } else { return this.props.children; } } (并且主页没有通过路线/results呈现。为什么会发生这种情况?任何人都可以帮助理解原因。 谢谢。

解决方法

您可以尝试使用来自 react-router 的重定向组件。在你的 if 块中而不是返回 Router 你可以只返回

<Redirect to="/" />

Router and Switch 基本上匹配浏览器 URL 和导航,但在您的情况下,您希望根据条件以编程方式导航,因此 Redirect 更适合此处。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。