javascript - ASP.NET MVC - 将包含数组的 FormData 映射到模型类

Question

在我的前端，我当前正在创建一个 FormData 对象，其中包含一个具有以下属性的数组:“productName”和“productQuantity”。我能够将 FormData 发送到我的服务器端。但是，我无法绑定(bind)任何值。如何将 FormData 中的对象列表正确映射到 Controller 上的 ASP.NET MVC 模型类？以下是我当前的代码:

更新我仍在尝试解决此问题，非常感谢您的帮助! 更新2 为了清楚起见，我使用 Vuejs 作为我的客户端框架

客户端

  const formData = new FormData();

  formData.append("Product[0].ProductName", "T-Shirt");
  formData.append("Product[0].Options.Quantity", "1");
  formData.append("Product[1].ProductName", "Shoe");
  formData.append("Product[1].Options.Quantity", "2");

服务器端( Controller )

    [HttpPost("verifyCart")]
    public async Task<IActionResult> verifyCart([FromForm] Product[] products)
    {
    }

服务器端(模型)

public class Product
    {
        public string ProductName { get; set; }
        public List<Option> Options { get; set; }        
    }


public class Options
    {
        public int Quantity { get; set; } 
    }

Answer 1

我可以通过更改表单数据来使其工作:

formData.append("Product[0].ProductName", "T-Shirt");
formData.append("Product[0].Options.Quantity", "1");
formData.append("Product[1].ProductName", "Shoe");
formData.append("Product[1].Options.Quantity", "2");

“产品”的复数

formData.append("Products[0].ProductName", "T-Shirt");
formData.append("Products[0].Options.Quantity", "1");
formData.append("Products[1].ProductName", "Shoe");
formData.append("Products[1].Options.Quantity", "2");

因为您在后操作中使用的参数是“产品”:

[HttpPost]
public IActionResult VerifyCart([FromForm] Product[] products)
{
}

我用来测试的客户端代码是:

const formData = new FormData();

    formData.append("Products[0].ProductName", "T-Shirt");
    formData.append("Products[0].Options.Quantity", "1");
    formData.append("Products[1].ProductName", "Shoe");
    formData.append("Products[1].Options.Quantity", "2");

    $.ajax({
            type: "POST",
            url: '/Home/VerifyCart',
            data: formData,
            processData: false,
            contentType: false,
            success: function (data) {
            }
     });

更新

我更改了客户端代码以解决数量问题:

const formData = new FormData();

    formData.append("Products[0].ProductName", "T-Shirt");
    formData.append("Products[0].Options[0].Quantity", "1");
    formData.append("Products[1].ProductName", "Shoe");
    formData.append("Products[1].Options[0].Quantity", "2");

    $.ajax({
            type: "POST",
            url: '/Home/VerifyCart',
            data: formData,
            processData: false,
            contentType: false,
            success: function (data) {
            }
     });