Search…

Auto

StartRC

Router

Query

Docs

Partners

React React

Latest

Search…

latest

React React

Latest

React Example: React Native

Github StackBlitz CodeSandbox

Code ExplorerCode

Interactive SandboxSandbox

assets
src
.eslintrc
.gitignore
App.tsx
README.md
app.json
babel.config.js
package.json
tsconfig.json

tsx

    import * as React from 'react'
    import { AppStateStatus, Platform } from 'react-native'
    import { NavigationContainer } from '@react-navigation/native'
    import {
      QueryClient,
      QueryClientProvider,
      focusManager,
    } from '@tanstack/react-query'

    import { useAppState } from './src/hooks/useAppState'
    import { MoviesStack } from './src/navigation/MoviesStack'
    import { useOnlineManager } from './src/hooks/useOnlineManager'

    function onAppStateChange(status: AppStateStatus) {
      // React Query already supports in web browser refetch on window focus by default
      if (Platform.OS !== 'web') {
        focusManager.setFocused(status === 'active')
      }
    }

    const queryClient = new QueryClient({
      defaultOptions: { queries: { retry: 2 } },
    })

    export default function App() {
      useOnlineManager()

      useAppState(onAppStateChange)

      return (
      )
    }

[Want to Skip the Docs?

“If you’re serious about really understanding React Query, there’s no better way than with query.gg”—Tanner Linsley

Learn More](https://query.gg?s=tanstack)