如何处理react-router子路由中抛出的异常

时间:2016-12-12 12:56:42

标签: javascript reactjs exception exception-handling react-router

我遇到使用react-router@3.0.0

进行异常处理的问题

我的路由器附件如下:

try {
  ReactDOM.render(<Router history={appHistory}>
    <Route path='/' component={Wrapper}>
      <Route path='bad' component={BadComponent}/>
    </Route>
  </Router>, domElement);
} catch(ex) {
  ReactDOM.render(<Exception ex={ex}/>, domElement);
}

我的问题是,如果Wrapper抛出渲染异常,我们最终会进入catch块。太好了!

如果Wrapper工作正常,但BadComponent会抛出渲染异常,我们则不会。 BOO!

如果我们达到这一点,那么路由器完全停止工作,我们无法导航到任何已知的好路线。

react-router API没有提到错误处理,所以我有点卡住了。

有没有办法让异常回到顶层,以便优雅地失败?

1 个答案:

答案 0 :(得分:0)

我知道现在回答可能为时已晚,您可能已经找到了解决方案,甚至不再使用此代码。

如果您还没有发现,请检查 react 提供的错误边界 https://reactjs.org/docs/error-boundaries.html