Apollo Client报400错误：React Native前端Mutation请求异常排查

以下是你代码中导致400错误的几个关键问题：

1. 字段大小写不匹配（核心原因） #

表单数据里的LastName是首字母大写，但GraphQL的UserInput类型基本遵循小驼峰命名规范（后端大概率定义的是lastName）。前端传参的字段名和后端期望的不匹配，直接触发参数校验失败，返回400状态码。

修复：统一字段名的小驼峰格式：

// 初始化表单数据
const [formData,setFormData] = useState({firstName:'',lastName:'',email:'',password:''})

// 修改LastName对应的输入框事件
onChangeText={(text) => handleChange('lastName',text)} value={formData.lastName}

2. 导入路径错误 #

Signup.js里导入SIGNUP_USERS的路径是../gqloperations/Mutation，但这个Mutation实际定义在src/queries/queries.js中。路径错误会导致前端未正确加载Mutation的GQL语句，请求结构不符合后端要求，引发400。

修复：修正导入路径：

import { SIGNUP_USERS } from '../queries/queries'

3. Mutation字段名与后端不匹配 #

你的查询里调用的是CreateUser，但GraphQL规范中字段名一般用小驼峰（createUser）。如果后端Apollo Server定义的Resolver是createUser，前端调用大写开头的CreateUser会找不到对应字段，返回400。

修复：统一字段名格式：

mutation createUser($newUser:UserInput!) {
  createUser(newUser:$newUser){
    firstName
  }
}

4. 成功提示逻辑错误 #

提交成功后你判断data.user，但Mutation返回的是createUser（或你定义的字段名），所以应该改成data.createUser，否则成功提示不会显示：

{  data && data.createUser && <View><Text style={{color:'green'}}>{data.createUser.firstName} Signup successfully!</Text></View>  }

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