compose（）経由で使用されるgraphQL突然変異のコールバック

Question

GraphQL突然変異コールバックを行うにはどうすればいいですか？

class CreateAccount extends Component { 
    constructor() { 
    super() 
    this.state = { 
     username: '', 
     password: '' 
    } 
    } 

    render() { 
    return (
     // form with input fields; values get stored as state 
    ) 
    } 

    _createUser = async() => { 
    const { username, password } = this.state 
    await this.props.createUserMutation({ 
     variables: { 
     username, 
     password 
     } 
    }) 
    } 
} 

export default compose(
    withData, 
    withApollo, 
    graphql(
    gql` 
     mutation RootMutationQuery($username: String!, $password: String!) { 
     createUser(
      username: $username, 
      password: $password, 
     ) { 
      _id 
      username 
      password 
     } 
     } 
    `, { name: 'createUserMutation' } 
) 
)(CreateAccount) 

Answer 1

私はあなたが約束として、突然変異を使用してフォームをクリックしたときに要求を行う提出することをお勧め：

これは私のコンポーネントを反応させ、変異がどのように見えるかです。

.catch機能でログインエラーを取得できることに注意してください。このエラーは、最終的なネットワークまたはgraphql Errorで構成され、異なる処理が必要です。例えば、this postを参照してください。

コンポーネントは次のようになります。

class CreateAccount extends Component { 
 
    constructor(props) { 
 
    super(props); 
 
    this.state = { 
 
     username: '', 
 
     password: '' 
 
    }; 
 
    } 
 

 
    render() { 
 
    return (
 
     // form with input fields; values get stored as state 
 
     // on submit is handled for the form 
 
    ); 
 
    } 
 

 
    _onSubmit = (event) => { 
 
    event.preventDefault(); 
 
    const { username, password } = this.state; 
 
    
 
    this.props.createUserMutation({ 
 
     variables: { username, password } 
 
    }).then(response => { 
 
     // data in response.data.createUser 
 
     // set state e.g. handle login 
 
    }).catch(error => { 
 
     // handle error 
 
    }); 
 
    } 
 
} 
 

 
export default compose(
 
    graphql(
 
    gql ` 
 
     mutation RootMutationQuery($username: String!, $password: String!) { 
 
     createUser(
 
      username: $username, 
 
      password: $password, 
 
     ) { 
 
      _id 
 
      username 
 
      password 
 
     } 
 
     } 
 
    `, { 
 
     name: 'createUserMutation' 
 
    } 
 
) 
 
)(CreateAccount)

を