React Query useQuery returns undefined with React Native

Viewed 40

I am trying to use React Query with React Native, according to the docs it should work out of the box

https://tanstack.com/query/v4/docs/react-native

I did everything exactly like in the other project I used React Query and for some reason, it returns undefined all the time this is my function

  const fetchedLocations = () => {
    return useQuery(["fetch-locations"], async () => {
      return await (
        await fetch("https://backend-upark.herokuapp.com/locations")
      ).json();
    });
  };
  const { data: locationss } = fetchedLocations();
  console.log({ locationss });

and this is my provider, outside the App fn I have

const client = new QueryClient();

and then in the component:

    <SafeAreaProvider onLayout={onLayoutRootView}>
      <NavigationContainer>
        <ApplicationProvider {...eva} theme={{ ...eva.light, ...theme }}>
          <QueryClientProvider client={client}>
            <ReduxProvider store={store}>
              <Stack.Navigator
                initialRouteName="Home"
                screenOptions={{
                  headerLeft: () => <BackButton />,
                  headerRight: () => <MenuDots />,
                  headerTitleStyle: {
                    fontFamily: "ClashGrotesk_Semibold",
                    color: "#E5E8E8",
                  },
                  headerStyle: {
                    backgroundColor: "#081E20",
                  },
                  headerShadowVisible: false,
                }}
              >
                    ... screens here
              </Stack.Navigator>
            </ReduxProvider>
          </QueryClientProvider>
        </ApplicationProvider>
      </NavigationContainer>
    </SafeAreaProvider>

what am I doing wrong? Thanks

0 Answers
Related