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

QueryErrorResetBoundary

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

定义于:packages/preact-query/src/QueryErrorResetBoundary.tsx:164

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

参数

props

QueryErrorResetBoundaryProps

要渲染的 children。

props 属性

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

返回值

Element

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

示例

TypeScript
1import { useErrorBoundary } from 'preact/hooks'2import type { ComponentChildren } from 'preact'3import { QueryErrorResetBoundary } from '@tanstack/preact-query'4 5function App() {6  return (7    <QueryErrorResetBoundary>8      {({ reset }) => (9        <ErrorBoundary reset={reset}>10          <Page />11        </ErrorBoundary>12      )}13    </QueryErrorResetBoundary>14  )15}16 17function ErrorBoundary({18  children,19  reset,20}: {21  children: ComponentChildren22  reset: () => void23}) {24  const [error, resetError] = useErrorBoundary(() => reset())25 26  if (error) {27    return (28      <div>29        There was an error!30        <button onClick={() => resetError()}>Try again</button>31      </div>32    )33  }34 35  return children36}

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

译自上游 59d11de