译零 TransZero · TanStack Query 中文文档
主站

QueryErrorResetBoundary

更新于 2026-11-02 React 查看英文原文 ↗
TypeScript
1function QueryErrorResetBoundary(props: QueryErrorResetBoundaryProps): Element;

定义于:packages/react-query/src/QueryErrorResetBoundary.tsx:160

当你在查询中使用 suspense 或 throwOnError 时,你需要一种方式来告知查询:在发生某些错误后重新渲染时,你希望重试。借助 QueryErrorResetBoundary 组件,你可以在该组件的边界内重置任意查询错误。

参数

props

QueryErrorResetBoundaryProps

要渲染的 children。

props 属性

属性 类型 描述
children | ReactNode | QueryErrorResetBoundaryFunction 要么是一个普通节点,要么是一个接收边界 QueryErrorResetBoundaryValue 的函数,并返回一个节点。

返回值

Element

按原样渲染的 children;若 children 是一个函数,则以边界的 QueryErrorResetBoundaryValue 为参数调用该函数。

示例

TypeScript
1import { ErrorBoundary } from 'react-error-boundary'2import { QueryErrorResetBoundary } from '@tanstack/react-query'3 4function App() {5  return (6    <QueryErrorResetBoundary>7      {({ reset }) => (8        <ErrorBoundary9          onReset={reset}10          fallbackRender={({ resetErrorBoundary }) => (11            <div>12              There was an error!13              <button onClick={() => resetErrorBoundary()}>Try again</button>14            </div>15          )}16        >17          <Page />18        </ErrorBoundary>19      )}20    </QueryErrorResetBoundary>21  )22}

本页为 TanStack Query 文档(React 版)的非官方中文翻译,原文由上游团队维护,遵循 MIT 许可。 译文如有偏差,以英文原文为准。

译自上游 59d11de