vue怎么把对象数组传输到后端并接收（formDate格式multipart/form-data）

 有时我们需要用content-type=multipart/form-data的格式传输数据，下面演示下前端上传与后端接收过程：

 第一步：前端上传 

new Vue({
    data:{
        addGoodsForm:{
            //规格数据
            goodsSpecsList: [{
                spec: '',          //规格
                price: '',         //价格
                stock: '',         //库存
            }]
           
        }

    },
    methods:{

        upload(){   
            //上传类型
            let config = {
                headers: {
                    'Content-Type': 'multipart/form-data'
                }
            };

            // 创建新的数据对象   多文件上传
            let formData = new FormData();  
                   
            //把数组对象存到formData中
            this.addGoodsForm.goodsSpecsList.forEach((item, i)=> {
                formData.append(`goodsSpecsList[${i}].spec`, item.spec)
                formData.append(`goodsSpecsList[${i}].price`, item.price)
                formData.append(`goodsSpecsList[${i}].stock`, item.stock)
            })
            // 自定义上传
            axios
                .post('输入你要上传的地址...', formData,config)
                .then((res) => {
                    //上传成功回调函数
                })
                .catch((err) => {
                   //上传失败回调函数
                })

        },
    }

})

第二步：后端接收（用的springMVC框架）

1.controller层

@RequestMapping("/upload")
@ResponseBody
public ResultInfo upload( GoodsSpecsVo goodsSpecsVo ) {

    System.out.println(goodsSpecsVo);
    ........

}

2.Vo接收模板类

public class GoodsSpecsVo {
    private List<GoodsSpecs> goodsSpecsList;

    @Override
    public String toString() {
        return "GoodsSpecsVo{" +
                "goodsSpecsList=" + goodsSpecsList +
                '}';
    }

    public List<GoodsSpecs> getGoodsSpecsList() {
        return goodsSpecsList;
    }

    public void setGoodsSpecsList(List<GoodsSpecs> goodsSpecsList) {
        this.goodsSpecsList = goodsSpecsList;
    }
}

 3.domain层

public class GoodsSpecs {
    private Integer id;
    private Integer goods_id;
    private Integer price;
    private String spec;
    private Integer stock;
    public GoodsSpecs(){}
    public GoodsSpecs(Integer id, Integer goods_id, Integer price, String spec, Integer stock) {
        this.id = id;
        this.goods_id = goods_id;
        this.price = price;
        this.spec = spec;
        this.stock = stock;
    }

    @Override
    public String toString() {
        return "GoodsSpecs{" +
                "id=" + id +
                ", goods_id=" + goods_id +
                ", price=" + price +
                ", spec='" + spec + '\'' +
                ", stock=" + stock +
                '}';
    }

    public Integer getId() {
        return id;
    }

    public void setId(Integer id) {
        this.id = id;
    }

    public Integer getGoods_id() {
        return goods_id;
    }

    public void setGoods_id(Integer goods_id) {
        this.goods_id = goods_id;
    }

    public Integer getPrice() {
        return price;
    }

    public void setPrice(Integer price) {
        this.price = price;
    }

    public String getSpec() {
        return spec;
    }

    public void setSpec(String spec) {
        this.spec = spec;
    }

    public Integer getStock() {
        return stock;
    }

    public void setStock(Integer stock) {
        this.stock = stock;
    }
}

end~~以上代码希望对您有所帮助~记得点赞支持哟~