React Error 是一个用于在 React 应用程序中显示错误消息的 NPM 包。它提供了一种简单的方法来捕获错误和异常，并向用户显示可定制的 UI。
安装
要使用 React-Error，首先需要将其作为依赖项添加到您的应用程序中。在命令行终端中执行以下命令：
npm install react-error --save
或者如果您使用 Yarn，请输入以下命令：
yarn add react-error
使用
在你的 React components 中引入 react-error，使用 ErrorBoundary 组件包装它们：
-- -------------------- ---- -------
------ ------ - --------- - ---- --------
------ ------------- ---- --------------
----- ----------- ------- --------- -
-------- -
------ -
---------------
------ --------------
----------------
--
-
-此时，如果 MyComponent 或其子组件遇到错误，ErrorBoundary 将渲染错误信息。如果不想使用默认错误信息组件，可以通过 fallbackComponent 属性来指定。
-- -------------------- ---- -------
------ ------ - --------- - ---- --------
------ ------------- ---- --------------
------ ------------------- ---- ------------------------
----- ----------- ------- --------- -
-------- -
------ -
-------------- ----------------------------------------
------ --------------
----------------
--
-
-MyFallbackComponent 组件将接收一个 error prop，您可以使用它来渲染自己想要的错误消息。
注意事项
ErrorBoundary仅在生产环境中开启错误捕获，开发环境中仍将触发本机的 JavaScript 错误处理程序。ErrorBoundary只能捕获其子组件的错误。 如果ErrorBoundary组件本身存在语法错误，则无法捕获它自己的错误信息。
示例代码
以下是一个使用 React Error 的示例代码，它演示了如何使用自定义的 fallbackComponent：
-- -------------------- ---- -------
------ ------ - --------- - ---- --------
------ ------------- ---- --------------
------ ---------------------- ---- ---------------------------
----- ----------- ------- --------- -
-------- -
------ -
-------------- -------------------------------------------
------ --------------
--------------- --
----------------
--
-
-
----- -------------- ------- --------- -
-------- -
----- ------- - -------------------
----- --- --------- --- ----- --- -- --------
------ -
-----
------------------
------
--
-
-
----- ---------------------- ------- --------- -
-------- -
----- - ----- - - -----------
------ -
-----
------------- ---- -----------
----------------------
------
--
-
-以上是一个基本的使用 React Error 的教程，通过捕获错误实现更好的用户体验。可以使用自定义 fallbackComponent 来呈现更出色的 UI，同时通过掌握 React Error，你能写出更好更健壮的 React 应用程序。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005751b81e8991b448ea3c0