Reactive variables as query parameters

Question

After implementing apollo-client into my react app, I noticed that a lot of input data will probably end up in a reactive variable somewhere. And if I want to request anything to the server, often, the value will come from a reactive variable. So it would simplify my code a lot if I could link the value of the reactive variable to the parameters of my query. Ideally, what I would want is something like this:

gql`
query FirstName {
  firstName @client
}
query LastName {
  lastName @client
}

query user($firstName: ???, $lastName: ???){
  user(firstName: $firstName, lastName: $lastName){
    id
    firstName
    lastName
    address
    dob
  }
}
`

Now, I understand that these requests would resolve in parallel, so the above would never work... But, how do I make it work? Do I need to add loadash just for this? Is there an apollo-client solution for this? How would I solve this with loadash or any other library?

diedu · Accepted Answer · 2022-01-18 04:29:46Z

2

+100

What you're looking for is the @export directive, this section of the docs explains how to use the local state as variables.

Your query would look like this

query user($firstName: ???, $lastName: ???){
  firstName @client @export(as: "firstName")
  lastName @client @export(as: "lastName")
  user(firstName: $firstName, lastName: $lastName){
    id
    firstName
    lastName
    address
    dob
  }
}

answered Jan 18, 2022 at 4:29

diedu

20.9k4 gold badges40 silver badges53 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Axel Over a year ago

Oh yeah, you're right. I couldn't get export to work, but it was because I had an issue with my InMemoryCache definitions. After revising those, your example works as expected

Collectives™ on Stack Overflow

Reactive variables as query parameters

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related