什么是错误边界,它们会捕获什么?

错误边界是一个组件,它在子树渲染期间捕获抛出的 JavaScript 错误,显示 fallback UI 而不是让整个应用崩溃,并且可以记录错误。

    {
  state = { :  };

   () {
     { :  }; 
  }
  () {
    (error, info);  
  }
  () {
     .. ?  : ..;
  }
}


<>
  
</>

它捕获的内容 — 以及不捕获的内容

✅ 捕获:render 中的错误、lifecycle methods 中的错误,以及其下方组件的构造函数中的错误。

❌ 不捕获:

• event handlers 中的错误(在那里使用普通的 try/catch)。
• Async 代码(promises、setTimeout) — 它们在渲染流之外。
• 错误边界本身中的错误,或在 SSR 期间。

为什么这很重要

• 错误边界目前必须是 class components(或为了使用 hook 友好的 API,可以使用 react-error-boundary 库)。
• 在独立部分(widgets、routes)周围放置多个边界,这样一个失败的 widget 不会导致所有内容崩溃 — 单个顶级边界会将任何错误变成完全空白的页面。