在前后端分离的场景下，开发者的工作内容更加专注和专业，但也会产生一些额外的沟通成本。例如：本文讲解的前后端参数传递和接收方式。本文主要讲解前端使用axios，后端使用Spring接受参数的情况。在使用spring和前端结合开发时，传参容易产生歧义的两个注解是@RequestParam注解，接受Content-Type:application/x-www-form-urlencoded编码格式的数据@RequestBody默认情况下的注释。JSON类型格式的数据。很多文章列出了参数传递失败问题的解决方案，在我看来还不够全面。这里我给大家总结一下1.@RequestParam注解对应的axios传参方式。以下面的Springjava代码为例。接口使用POST协议，需要接受的参数有tsCode、indexCols、table。对于这个SpringHTTP接口，axios应该怎么传参呢？有多少种方法？让我们一一介绍。@PostMapping("/line")公共列表commonEChart(@RequestParamStringtsCode,@RequestParamStringindexCols,@RequestParamStringtable){1.1.params参数传递（推荐）使用axios实例的params进行参数传递，params参数会被格式化成x-www-form-urlencoded格式，与后端参数一一对应，传参即可成功。这也是我推荐给大家的传参方式！returnrequest({url:'/chart/line',method:'post',params:{//注意这里的key是paramstsCode,indexCols,table}})1.2.FormData传参也可以使用js的FormData对象进行参数格式化，也可以正确使用Spring后端的@RequestParam注解进行参数接收。letparams=newFormData();params.append('tsCode',tsCode);params.append('indexCols',indexCols);params.append('table',table);returnrequest({url:'/chart/line',method:'post',data:params//注意这里的key是data})1.3.qs.stringfy传参也可以使用qs.stringfy进行参数格式化，在Spring中也可以正确使用用于参数接收的后端@RequestParam注解。importqsfrom"qs";returnrequest({url:'/chart/line',method:'post',data:qs.stringify({//注意这里的key是datatsCode,indexCols,table})})需要注意的是，使用该方法需要手动设置header(Content-Type)constservice=axios.create({headers:{"Content-Type":"application/x-www-form-urlencoded"}});2、@RequestBody的axios传参方法的java代码部分如下。DemoModel类是一个实体类，它包含三个字符串成员变量，名为tsCode、indexCols和table。接收到的JSON格式的参数会自动给demo对象的成员变量赋值。@PostMapping("/line")公共列表commonEChart(@RequestBodyDemoModeldemo){@RequestBody注解，默认接受JSON格式的数据。在axios中，默认的data传参会默认使用json数据格式，所以不需要额外做特殊处理。returnrequest({url:'/chart/line',method:'post',data:{//注意这里的key是datatsCode,indexCols,table}})欢迎关注我的公告号：字母哥杂谈，回复003赠送了本文所在的专栏《docker修炼之道》的PDF版，以及30多篇docker优质文章。Antetokounmpo博客：zimug.com
