Questions tagged [react-apollo]

React Apollo allows you to fetch data from your GraphQL server and use it in building complex and reactive UIs using the React framework. React Apollo may be used in any context that React may be used. In the browser, in React Native, or in Node.js when you want to do server-side rendering.

react-apollo tag should be used for questions that are about the usage of the react-apollo ApolloClient container.

It should be included with the apollostack (and related) tags to clarify that this is the client wrapper being used.

It alleviates the need to use the , which should not be used, unless a person who knows nothing about react-apollo is likely to be able to answer the question.

Related tags

2335 questions
16
votes
1 answer

Next Js Custom Routes and SSR

I am using apollo with next and recently I noticed that custom routes breaks SSR. Usually if you navigate through pages apollo caches the query and when you are on the page the next time, it serves everything from cache. However with custom routes,…
Yasin Yaqoobi
  • 1,888
  • 3
  • 27
  • 38
16
votes
1 answer

How can I use the useQuery hook to populate state in other hooks?

I have been dealing with a few hook-related issues recently as I have been implementing hooks into a project of mine. I keep getting the error "Rendered more hooks than during the previous render." It seems that the only way I can get my code to…
ElektrikSpark
  • 613
  • 1
  • 8
  • 21
16
votes
1 answer

Unsubscribe subscription in Apollo Client

In my component, I have this code: componentDidMount () { // Setup subscription listener const { client, match: { params: { groupId } } } = this.props client.subscribe({ query: HOMEWORK_IN_GROUP_SUBSCRIPTION, variables: { groupId }, …
V0iDiFiER
  • 165
  • 1
  • 1
  • 4
16
votes
6 answers

Multiple Queries/Mutation in Apollo 2.1

I need some help using the new Query and Mutation component in Apollo 2.1, especially with multiple queries and mutations. I have the following problems: I have a graphql request that depends on a previous graphql result, how can I deal with…
brunodahora
  • 331
  • 1
  • 3
  • 6
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
15
votes
3 answers

How to pass variables to a GraphQL query?

Lets assume I have the following GraphQL query in React-Apollo const CurrentUserForLayout = gql` query CurrentUserForLayout($avatarID: Int!) { currentUser { avatar_url(avatarID: $avatarID) } } `; const ProfileWithData =…
henk
  • 2,677
  • 2
  • 18
  • 49
14
votes
2 answers

How can i run one mutation multiple times with different arguments in one request?

I have a mutation: const createSomethingMutation = gql` mutation($data: SomethingCreateInput!) { createSomething(data: $data) { something { id name } } } `; How do I create many Somethings in one request? Do…
Maxim Zubarev
  • 2,403
  • 2
  • 29
  • 48
13
votes
5 answers

Use Postman to test a service with GraphQL in AWS (AppSync, Apollo)

I'm trying to call a service through Graphql with Postman. From my app (React) I can use all the services with no problem (so, they are running ok), but I want to test them alone with Postman. I'm using AppSync, this is my configuration: const…
pmiranda
  • 7,602
  • 14
  • 72
  • 155
13
votes
1 answer

How to acess React context from Apollo set Context Http Link

I am trying to access a react context values within the setContext function for my Apollo client. I would like to be able to dynamically update the header for each graphql request with the react context value. But I face an error with no visible…
john
  • 1,057
  • 1
  • 17
  • 28
13
votes
2 answers

React: UI Flickering When State Updated

I have a component that displays search data returned from the Spotify API. However, every time I update the state the UI flickers: Input:
Travis S.
  • 343
  • 1
  • 4
  • 14
13
votes
2 answers

How to fix `Warning: Text content did not match. Server: "Some Data" Client: "Loading..."`

I'm getting this error on initial load of my SSR application: Warning: Text content did not match. Server: "SOME DATA" Client: "Loading..." How to initialize client side of the app without setting loading flag to true? I’m setting up a SSR with…
rreckonerr
  • 387
  • 1
  • 3
  • 12
13
votes
2 answers

Apollo-client with parcel warnings

Have been trying to setup apollo-client with parcel for my react app. Things work fine but in the console, there are plenty of warnings regarding missing source files in node_modules/apollo-client in my CI pipeline. Have tried clearing yarn cache,…
Abhijeet_IXR
  • 807
  • 6
  • 15
13
votes
4 answers

refetchQueries in Mutation Component of React Apollo Client is not working?

I have a in my Home.js file Home.js {({ data: { product } }) => { return
deadcoder0904
  • 7,232
  • 12
  • 66
  • 163
13
votes
3 answers

Is graphql's ID type necessary if I've set an unique identifier with dataIdFromObject in Apollo Client

I'm using graphql + mysql + react-apollo and here's one of the graphql type for User table: type User { id: ID! name: String! } My issue with ID scalar type in graphql is that it is returned as a string when primary keys are int in mysql and it…
RedGiant
  • 4,444
  • 11
  • 59
  • 146
13
votes
5 answers

How to use Apollo Client + React Router to implement private routes and redirection based on user status?

I am using React Router 4 for routing and Apollo Client for data fetching & caching. I need to implement a PrivateRoute and redirection solution based on the following criteria: The pages a user is permitted to see are based on their user status,…
AnApprentice
  • 108,152
  • 195
  • 629
  • 1,012