0
私は、Apollo ClientとGraphQLをバックエンドとしてReact Nativeプロジェクトに取り組んでいます。私が抱えている問題は、突然変異を使って新しいユーザーを登録したときに、ユーザーが作成されているという肯定的な応答が返ってくるが、というエラーがスローされてしまうということだ。TypeError:定義されていないReact Native、GraphQL、Apollo - 突然変異中にスローされたエラー
問題が何であるか、またはエラーがまったく返されない理由はわかりません。
'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))
このコンポーネントから特にエラーが発生していますか?私が試してみようとしているのは、 "this"が間違ったスコープで危険なものになる可能性があり、その値が実行時に決定されるので、 "this"を "if"文の中に出力することです。 – mstorkson
ええ、それはエラーを投げています - 具体的には次の行: '.catch((err)=> {console.log("エラーが検出されました: "+ err)}' また、デベロッパーコンソールを見て、なぜなら、エラーはサーバからの成功応答を受け取った後にエラーを投げているからです。 – Kaidao
エラーは、何かが 'x.variables'を検索し、xがnullであることを意味します。あなたが間違って2回発砲しているかどうかを確認して、2回目に渡された変数がないかどうか確認できますか? – mstorkson