主分支
分支
主分支 (6.23.1)开发分支
版本
6.23.1v4/5.xv3.x
useRouteError

useRouteError

errorElement 中,这个钩子函数会返回在 action、loader 或渲染过程中抛出的任何异常。请注意,抛出的响应会进行特殊处理,请参阅 isRouteErrorResponse 获取更多信息。

此功能仅在使用数据路由器时有效,请参阅 选择路由器

function ErrorBoundary() {
  const error = useRouteError();
  console.error(error);
  return <div>{error.message}</div>;
}

<Route
  errorElement={<ErrorBoundary />}
  loader={() => {
    // unexpected errors in loaders/actions
    something.that.breaks();
  }}
  action={() => {
    // stuff you throw on purpose in loaders/actions
    throw new Response("Bad Request", { status: 400 });
  }}
  element={
    // and errors thrown while rendering
    <div>{breaks.while.rendering}</div>
  }
/>;
文档和示例 CC 4.0