Apollo GraphQL客户端执行Mutation报错，GraphiQL正常求排查

我帮你梳理出几个关键问题，你可以逐一排查修复：

1. GraphQL类型大小写错误 #

在createUser.ts里，你写了$name: string——但GraphQL的标量类型是首字母大写的，小写的string是无效语法，会导致客户端解析失败。所有类型都要改成大写形式，比如String、Int等。

2. Mutation参数结构不匹配（核心问题） #

你在GraphiQL里的Mutation是把用户字段包裹在user对象里传递的：

mutation createUser {
  createUser (user: { name: "Apollo" email: "mail@mail.com" ... } ){ id }
}

但客户端的Mutation定义里，直接把name/email等字段作为顶层参数传给createUser，完全不符合服务端期望的参数结构！服务端需要的是一个user输入对象，而非分散的参数。

修正后的代码示例 #

修正createUser.ts

import gql from 'graphql-tag'

export const createUser = gql`
mutation createUser(
  $email: String!
  $name: String!
  $birthday: Int!  # 注意：你GraphiQL里传的是数字1993，这里要和服务端类型匹配，如果是日期字符串再用String
  $phoneNumber: String!
) {
  createUser(
    user: {  # 必须包裹到user对象里，和GraphiQL结构一致
      name: $name
      email: $email
      birthday: $birthday
      phoneNumber: $phoneNumber
    }
  ) {
    id
  }
}
`

提示：建议加上!非空断言，如果服务端要求这些字段必填的话，避免参数缺失报错。

优化客户端调用的错误处理

signUpFormContainer.tsx里的console.log(data, error)会因为Mutation的异步特性打印旧值，建议改用异步捕获：

<Mutation mutation={createUser}>
  {(createUser, { data, error, loading }) => (
    <View style={styles.container}>
      <SignUpForm 
        loading={loading} 
        onSubmit={async (name, birthday, email, phoneNumber) => {
          console.log(name, birthday, email, phoneNumber)
          try {
            const result = await createUser({ 
              variables: { phoneNumber, email, birthday, name } 
            })
            console.log('创建成功:', result.data.createUser.id)
          } catch (err) {
            console.error('创建失败:', err.message)
          }
        }} 
      />
      {error && <Text>错误：{error.message}</Text>}
    </View>
  )}
</Mutation>

额外注意点 #

确认birthday的类型：你在GraphiQL里传的是数字1993，如果服务端Schema里birthday是Int类型，客户端就要用Int!；如果是日期字符串（比如"1993-01-01"），再改成String!，必须和服务端定义一致。

内容的提问来源于stack exchange，提问作者Matheus Barradas