前端如何利用form表单传数组

在写前端的时候碰到了传数组的问题，于是我利用form表单测试了一下。

如何利用form表单传数组

form表单的常用形式如下：

根据我目前的需求：传数组

    
        

            books1:
            
        
        

        

            books2:
            
        
        
    

关于form表单，一个

表示一行，所以写多个

表示多行，在submit的时候就是一个数组了

Java后端的接收

关于后端我是用的SpringMvc，所以接收传值常用@RequestParam和@RequestBody两个注解

• 由于form表单不能用@RequestBody接收（具体原因可以看看这段踩坑过程Springboot出现Content type ‘application/x-www-form-urlencoded;charset=UTF-8’ not supported），所以考虑用@RequestParam接收。

• 关于@RequestParam注解，赋值的过程在我看来更像是从map中取值（default key就是变量名），所以我还真不是很确定能取到值

跟随前人的足迹

• 网上有很多关于此的文章，我找了一个看起来比较靠谱的做法，套到我的代码中去

@PostMapping("/addMul")
    public HashMap addMulQuestion(@RequestParam(value = "books[]", required = false) ArrayList books) {
        System.out.println(books);
        return null;
    }

确实有打印，说明此方法可行

摸索

各位仔细回看一下代码会发现我的前端代码的name=“books[]”,而后端接收的value的name也是"books[]",那么我是否有理由猜测，其实根本没必要命名成数组，只要名字统一即可，在底层如果有value名字相同的就会自动封装成数组

验证

我将name改成books

    
        
        

            books1:
            
        
        

        

            books2:
            

        
        
    

后端也做相应的改变

@PostMapping("/addMul")
    public HashMap addMulQuestion(@RequestParam(value = "books[]", required = false) ArrayList books) {


        System.out.println(books);

        return null;
    }

测试结果是：

• 我的猜想是对的

为了进一步证实猜想，我用postman再一次验证了一下

结论

发送key相同的表单，@RequestParam接收会自动封装成数组