Search code examples
reactjsmongodbgraphqlreact-apolloapollo-boost

[GraphQL error]: Message: Variable "$id" of required type "MongoID!" was not provided


I have the following query:

import { gql } from 'apollo-boost';
const GetUserInfo = gql`
query getUserInfo($id: MongoID!){
    userById(_id: $id){
      local{
        username
...
    }
  }
`;

export  {GetUserInfo} ;

then I have bound the query to my "React.Component"

import React from "react";
...
import { GetUserInfo } from "../../queries/queries";
import { graphql } from 'react-apollo';



class Dashboard extends React.Component {
  constructor(props) {
    super(props);
...

Dashboard.propTypes = {};



export default graphql(GetUserInfo, {
  options: (props) => {
    return {

          variables: {
              _id: props.ID
      }
    }
  }
})(Dashboard);

I am certain the props.ID is equivalent to a MongoDB ID. I am also certain the props from the parent component are being read.

The above code results in the following error:

[GraphQL error]: Message: Variable "$id" of required type "MongoID!" was not provided., Location: [object Object], Path: undefined

console error

Any feedback will be greatly appreciated. Thank you!


Solution

  • The variable used in the query is $id; the query needs to be executed with this variable passed in the options.

    Currently a value for _id is passed and that's a different variable that is never used in the query.

    You can have both variable be of the same name.

    export default graphql(GetUserInfo, {
      options: (props) => {
        return {
    
              variables: {
                  id: props.ID
          }
        }
      }
    })(Dashboard);