Questions tagged [react-apollo-hooks]
89 questions
31
votes
2 answers
How to call useQuery hook conditionally?
Because of the Rules of Hooks, one shouldn't call hooks conditionally. So how does one fetch data conditionally using useQuery? For example, let's say I want to fetch data inside a functional component, but only if someState === someValue? i.e I…
M. M
- 520
- 1
- 5
- 9
22
votes
2 answers
How to execute query on every click using useLazyQuery()
Using useLazyQuery() hooks from @apollo/react-hooks I was able to execute a query on click of a button. But I cannot use it execute same query on consecutive clicks.
export default ({ queryVariables }) => {
const [sendQuery, { data, loading }] =…
arjun
- 3,514
- 4
- 27
- 48
15
votes
0 answers
What is the difference between client.query and useQuery in Apollo?
In my query, I use a blend of remote and local properties. The local properties have different values depending on:
The remote properties
The current unix timestamp
The local resolvers computes the local state according to these rules. Now, I face…
Paul Razvan Berg
- 16,949
- 9
- 76
- 114
10
votes
3 answers
Apollo Hooks - useLazyQuery not using onCompleted option if passed on query
I have a custom debounce hook for apollo lazy queries:
import {useLazyQuery} from '@apollo/react-hooks';
import debounce from "lodash/debounce";
export function useDebouncedQuery(schema) {
const [doQuery, {...rest}] = useLazyQuery(schema);
…
jrkt
- 2,615
- 5
- 28
- 48
9
votes
2 answers
How to switch polling on and off in Apollo?
I use the useQuery Hook like this:
function Foo() {
const { data, error, loading } = useQuery(MY_QUERY, { pollInterval: 1000 });
return (
<>
Paul Razvan Berg
- 16,949
- 9
- 76
- 114
9
votes
1 answer
Example of how to test a component that uses useQuery?
I have a React component that uses the Apollo hooks lib's useQuery hook. I'm having trouble testing this component. Here is my current setup.
import React from 'react';
import { BrowserRouter as Router } from 'react-router-dom';
import DashboardBar…
maxwellgover
- 6,661
- 9
- 37
- 63
8
votes
1 answer
Why is my custom hook called so many times?
I'm trying to implement a custom hook to provide the app with a guest shopping cart. My hook wraps around the useMutation hook from Apollo and it saves the shopping cart id in a cookie while also providing a function to "reset" the cart (basically,…
Daniel Platon
- 583
- 7
- 16
7
votes
2 answers
Invalid hook call. Hooks can only be called inside of the body of a function component when i call useQuery in useEffect
I am using apollo-graphql in my react project and i am getting error of
Invalid hook call. Hooks can only be called inside of the body of a function component
Here is my code for this
import React, { useEffect, useState, useCallback } from…
Ratnabh kumar rai
- 1,426
- 4
- 21
- 48
6
votes
2 answers
Skip argument is being ignored in useQuery hook from @apollo/react-hooks
The issue:
Hello, so I've been using apollo-client for a while on my ReactJS application. I've just noticed that sometimes when I use the useQuery hook, the execution completely ignores the skip argument, and just proceed with the onCompleted…
jengel
- 323
- 4
- 10
6
votes
2 answers
Does onCompleted works with useMutation?
I am using useMutation hook in react project. The mutation runs successfully but it's not reaching onCompleted afterwards.
I have set notifyOnNetworkStatusChange to true in the mutation but that doesn't seem to help.
const [createUser] =…
Sibgha Samdani
- 83
- 1
- 1
- 6
6
votes
2 answers
Possible unhandled promise rejection warning with useMutation
I'm getting an unhandled promise rejection error when I use useMutation with react native. Here's the code producing the issue:
const [createUser, { error, loading }] = useMutation(CREATE_USER_MUTATION);
Anytime my graphql server returns an error…
coops22
- 401
- 7
- 15
6
votes
1 answer
Execute react-apollo-hooks useQuery Only the First Time a Component Renders Idiomatically and Elegantly
I'm using the most excellent react-apollo-hooks library, specifically the useQuery hook:
function Index() {
...
const [dialogOpen, setDialogOpen] = useState({ show: false, id: '0' });
...
const { data, error } = useQuery(GET_JOBS,…
Robert Moskal
- 21,737
- 8
- 62
- 86
5
votes
1 answer
How to use mutations in react-apollo-hooks and formik?
In my many attempts, I've tried to use react-apollo-hooks and formik together but it seems impossible. The data from the forms is only available in the tag, and is otherwise inaccessible outside of it. Also I can't call my useMutation hook…
pizzae
- 2,815
- 6
- 26
- 45
4
votes
1 answer
How to use Apollo Client custom hooks with TypeScript?
I'm trying to create a custom Apollo Client mutation hook in a TypeScript project in the following shape:
const customApolloMutation = () => {
const [
mutationFunction,
{ data, loading, error, ...result } // or just {...result}
] =…
HigoChumbo
- 858
- 2
- 9
- 23
4
votes
0 answers
Apollo hooks useQuery and useMutation under the same component
I just recently started to learn GraphQL and React-Apollo and I'm wondering what's the recommended approach of using useQuery and useMutation hooks if I need them inside the same component.
Since both hooks return {data, loading, error} object the…
Oleksandr Fomin
- 2,005
- 5
- 25
- 47