React Native，GraphQL，Apollo-突變期間引發的錯誤

Question

我正在使用Apollo Client和GraphQL作為后端的React Native項目。 我遇到的問題是，當我使用突變注冊一個新用戶時，我得到一個肯定的響應：該用戶已被創建，但是我還拋出一個錯誤，提示錯誤已捕獲：TypeError：無法讀取屬性的“變量”未定義

我不確定是什么問題，還是根本不返回錯誤。 這是代碼：

 'use strict' import React, { Component } from 'react'; import { Text, View, StyleSheet, AsyncStorage, Modal, TouchableHighlight } from 'react-native' import { Actions, ActionConst } from 'react-native-router-flux' import { Button } from 'react-native-elements' // Apollo and GraphQL Packages import ApolloClient, { graphql, withApollo } from 'react-apollo' import gql from 'graphql-tag' import { filter } from 'graphql-anywhere' import { connect } from 'react-redux' import Auth0Lock from 'react-native-lock' // Styling Packages import LinearGradient from 'react-native-linear-gradient' import EStyleSheet from 'react-native-extended-stylesheet' // View Packages import ViewContainer from './ViewContainer' // Auth0 Credentials const clientId = "XXXX" const domain = "XXXX" // Props Declaration type Props = { client: ApolloClient, createUser: ({ variables: { idToken: string, name: ?string, email: ?string } }) => { id: string} } class Login extends Component { _lock: Auth0Lock props: Props constructor(props) { super(props) this._lock = new Auth0Lock({ clientId: clientId, domain: domain, useBrowser: true }) } _showLogin() { this._lock.show({ closable: true, connections: ['Username-Password-Authentication'] }, async (err, profile, token) => { if (!err) { AsyncStorage.setItem('token', token.idToken) .then(() => { this.props.client.resetStore() }) this.props.createUser({ variables: { idToken: token.idToken, name: profile.name email: profile.email } }) .then((data) => { console.log("Data received: " + data) Actions.registration({ type: ActionConst.REPLACE }) }) .catch((err) => { console.log("Error caught: " + err) AsyncStorage.removeItem('token') .then(() => this.props.client.resetStore()) // Actions.home({ type: ActionConst.REPLACE }) }) } else { console.log(err) } }) } render() { return( <LinearGradient colors={['#34E89E', '#0F3443']} style={styles.linearGradient}> <ViewContainer style={styles.viewContainer}> <Button small raised buttonStyle= {styles.button} color="#fff" title="Login" onPress={() => this._showLogin()} /> </ViewContainer> </LinearGradient> ) } } const styles = EStyleSheet.create({ viewContainer: { flex: 1, paddingTop: 70, paddingLeft: 20, paddingRight: 20 }, linearGradient: { height: '$height', }, logo: { fontFamily: 'LiberatorHeavy', fontSize: 52, alignSelf: 'center', marginBottom: 400, color: 'white', backgroundColor: 'transparent' }, button: { backgroundColor: '#222222' } }); const createUserMutation = gql` mutation createUser($idToken: String!, $name: String, $email: String) { createUser( authProvider: { auth0: { idToken: $idToken } }, name: $name, email: $email ){ id } }` export default withApollo( graphql(createUserMutation, { name: 'createUser' } )(Login)) 

Answer 1

所以錯誤是

createUser({variables...})

函數觸發兩次，一旦清除了變量，就會引發錯誤。 我將代碼更改為：

 _showLogin() { this._lock.show({ closable: true, connections: ['Username-Password-Authentication'] }, async (err, profile, token) => { if (!err) { AsyncStorage.setItem('token', token.idToken) .then(() => { this.props.client.resetStore() // Create user function was put in to AsyncStorage function to stop function from running twice. (Not sure why that was happening) this.props.createUser({ variables: { idToken: token.idToken, name: profile.name, email: profile.email } }) .then((data) => { console.log("Data received: " + data) Actions.registration({ type: ActionConst.REPLACE }) }) .catch((err) => { console.log("Error caught: " + err) AsyncStorage.removeItem('token') .then(() => this.props.client.resetStore()) // Actions.home({ type: ActionConst.REPLACE }) }) }) } else { console.log(err) } 

這解決了問題，並且我得到了正確的響應，盡管我仍然不確定為什么它在Async函數之后運行兩次。

如果有人有任何想法，請告訴我！