Search code examples
graphqlapolloreact-apollomutation

GraphQL Apollo recieving data object undefined


I am doing a mutation, that takes a username and password, and in response from the server it gets a login response.

<Mutation mutation={SIGN_UP}>
        {(signUp, data) => (
         <form onSubmit={e => {
            e.preventDefault();
            signUp({
                 variables: { 
                    user: {
                    "email": input_email.value as String, 
                    "password": input_password.value as String
                    }
                }
            });
            console.log("Signup", signUp)
            console.log("Data", data.data);

            input_email.value = "";
            input_password.value = "";
         }}>
            <div className="col-sm">
                <div className="signin__header">Signup IMPACT R&D</div>
            </div>
            <div className="col-sm signin__input" >
                <div className="signin__input__header" >Email</div>
                <input className="signin__input__email" type="text" placeholder="Enter email" required ref={node=> {input_email = node}}></input>
                <div className="signin__divide-line"></div>
            </div>
            <div className="col-sm signin__input">
                <div className="signin__input__header" >Password</div>
                <input className="signin__input__password" type="password" placeholder="Enter password" ref={node=> {input_password = node}}></input>
                <div className="signin__divide-line"></div>
            </div>
            <div className="col-sm-3">
                <button className="signin__input__button" type="submit">Sign Up</button>
            </div>
         </form>
    )}
</Mutation>

This is my GraphQLtag.

 export const SIGN_UP : any = gql`
 mutation Register($user: UserInput!) {
    register(user: $user) {
        status,
        refreshToken,
        token,
        error
    }
 } 
`;

in the browser network i can see that I receive the data. But still my data object is null, when i try to print it out... HELP!


Solution

  • Found out that i needed to wait for the response with a then promise after the signup

    }).then ((res: any) => {
    errorMessage = res.data.register.token;
    });