useQueryErrorResetBoundary

This hook will reset any query errors within the closest QueryErrorResetBoundary. If there is no boundary defined it will reset them globally:

tsx

import { useQueryErrorResetBoundary } from '@tanstack/react-query'
import { ErrorBoundary } from 'react-error-boundary'

const App = () => {
  const { reset } = useQueryErrorResetBoundary()
  return (
    <ErrorBoundary
      onReset={reset}
      fallbackRender={({ resetErrorBoundary }) => (
        <div>
          There was an error!
          <Button onClick={() => resetErrorBoundary()}>Try again</Button>
        </div>
      )}
    >
      <Page />
    </ErrorBoundary>
  )
}

import { useQueryErrorResetBoundary } from '@tanstack/react-query'
import { ErrorBoundary } from 'react-error-boundary'

const App = () => {
  const { reset } = useQueryErrorResetBoundary()
  return (
    <ErrorBoundary
      onReset={reset}
      fallbackRender={({ resetErrorBoundary }) => (
        <div>
          There was an error!
          <Button onClick={() => resetErrorBoundary()}>Try again</Button>
        </div>
      )}
    >
      <Page />
    </ErrorBoundary>
  )
}

Edit on GitHub

QueryErrorResetBoundary

hydration

Our Partners

Wow, it looks like you could be our first partner for this library! Chat with us!

Want to Skip the Docs?

“This course is the best way to learn how to use React Query in real-world applications.”—Tanner Linsley

Get the course

This ad helps to keep us from burning out and rage-quitting OSS just *that* much more, so chill. 😉

Want to Skip the Docs?

“This course is the best way to learn how to use React Query in real-world applications.”—Tanner Linsley

Get the course