React Native Fetch提交数据至ASP.NET Web API时接收对象为空问题排查

嘿，我来帮你捋捋这个问题——后端接收的company一直是null，主要是这几个地方出了问题，咱们一个个来修正：

1. 前端请求体的分隔符用错了 #

你拼接body的时候写了&，这是HTML里的转义字符，但在Fetch的请求体里直接用普通的&来分隔参数就好啦！用&会让后端解析出奇怪的参数名（比如password&grant_type），根本识别不了正确的字段，先把这个改过来：

let response = await fetch(`${apiConfig.url}${action}`, {
  method: "POST",
  headers: requestHeaders,
  body: `userName=${encodeURIComponent(body.UserName)}&password=${encodeURIComponent(body.Password)}&grant_type=password`,
});

2. 必须给请求头加上正确的Content-Type #

ASP.NET Web API得知道你发的是什么格式的数据才能正确解析，所以你的requestHeaders里一定要包含Content-Type: application/x-www-form-urlencoded，不然后端不知道这是表单数据，自然绑定失败：

const requestHeaders = {
  'Content-Type': 'application/x-www-form-urlencoded',
  // 其他你需要的头信息比如Authorization之类的可以保留
};

3. 后端参数要加[FromForm]特性 #

默认情况下，ASP.NET Web API会从JSON请求体里绑定复杂类型（比如你的Company对象），但你发的是表单格式的数据，所以得给参数加个[FromForm]特性，告诉框架“从表单数据里找这个对象的字段”：

[HttpPost]
public IHttpActionResult Save([FromForm]Company company) {
    var result = _companyRepository.Create(company);
    return Ok(result);
}

4. 确认前后端字段名完全匹配（注意大小写！） #

最后别忘了检查你的Company类属性名和前端发的参数名是不是对应上了——C#是区分大小写的哦！比如前端发的是userName，后端Company类里的属性得是UserName，或者如果后端属性名不一样，就用[FromForm(Name = "xxx")]来映射：
举个例子，如果前端发的是username（全小写），后端属性是UserName，就这么写：

public class Company {
    [FromForm(Name = "username")]
    public string UserName { get; set; }
    [FromForm(Name = "password")]
    public string Password { get; set; }
    // 其他属性...
}

把这几个点都改完，应该就能正常接收到数据啦！

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