我如何处理异常？

Question

Angular 有很棒的 $exceptionHandler。 react.js有这样的东西吗？

我想将我的错误记录到外部 API。示例：

Answer 1

没有像 angular 那样的魔法。如果有未捕获的错误，它会向上传播范围，直到它命中 window，然后发出错误事件——与没有反应的错误相同的行为。

var App = React.createClass({
  render: function(){
    throw new Error("rawr!");
    return <div>Hello, world!</div>
  }
});

window.addEventListener('error', function(e){
  // e instanceof ErrorEvent
  console.error('caught the error: ' + e.message);
});

如果您研究跨浏览器支持，请更新此答案或添加带有引用的评论。

无需将其记录到控制台（默认情况下已经发生），您可以将其发送到任何您喜欢的地方。

与其他一些框架不同，未捕获的错误始终是代码中的错误。它永远不应该发生。

您可能还需要对承诺错误进行一些特殊处理，方法是在链的末尾显式添加 .catch(reportError)，并检查它是 TypeError 还是 ReferenceError。

Answer 2

虽然@FakeRainBrigand 的回答为理解 Javascript 中一般 'uncaught error' 报告机制的机制提供了一个很好的起点，但我觉得大多数应用程序都使用 CDN 托管他们的 JS 包，您可以' 使用 "window.addEventListener('error', fn)" 机制捕获未捕获的错误。

绕过跨源限制

将 crossorigin 属性添加到您的脚本标签中，这样您就可以享受使用 "window.addEventListener('error', fn)" 机制捕获未捕获错误的乐趣。

在您无法使用 cors 设置的情况下

React 16：提供built-in错误处理机制。详细了解 Error Boundaries in React here

React 15 或以下：这里捕获错误的唯一方法是在每个 renders/components 周围添加 try-catch 块。幸运的是，我们有一个 npm 模块——react-guard，它通过修补 React 来为我们做这件事。

我如何处理异常？

How do I handle exceptions?

error-handling

exception-handling

reactjs