axios post/get请求 @RequestBody @RequestParam对应的用法

参考文章

一、POST请求
1、 @RequestParam方式：

前端，需要用qs.stringify（data）：

ceshi = ()=>{

      let data = {
        // "idd": "f6588b4d3a274d599c8696e3a2e89579",
        // "name":"水"
        idd: 'Fred',
        lastName: 'Flintstone'
      };
      // alert()
      axios.post(`${base}/t-stu/testWarpper`, 
        qs.stringify({
          idd: 'f6588b4d3a274d599c8696e3a2e89579',
          lastName: 'Flintstone'
        })
      )
      .then((response)=> {
        console.log(response);
      })
      .catch(function (error) {
        console.log(error);
      })
      .then(function () {
        // always executed
      });  
    }

注：qs安装：
npm install --save axios vue-axios qs
import qs from ‘qs’ qs 用来解决vue中post请求以 a=a&b=b 的格式（详情）
后台@RequestParam 获取参数：

@Autowired private VideoService videoService;
	@ResponseBody
	@RequestMapping(value = "getVideoPath",produces={"text/json;charset=UTF-8","application/json;charset=UTF-8"})
	public ResultMsg getVideoPath(@RequestParam(value="glb") String glb,@RequestParam(value="railwayName") String railwayName, @RequestParam(value="upDown") String upDown) {
		int glbInt = (Integer.parseInt(glb)/100)*100;
		BigDecimal glBigDecimal = new BigDecimal(glbInt);
		List<String> videoInfo = videoService.getVideoPathAndSecond(railwayName, glBigDecimal, upDown);
		if (videoInfo.size() > 0) {
			ResultMsg resultMsg = new ResultMsg(0, "ok", videoInfo);
		    return resultMsg;
		}else {
			ResultMsg resultMsg = new ResultMsg(1, "false", null);
		    return resultMsg;
		}
			
	}

2、@RequestBody方式
前端代码：

ceshi = ()=>{

      let data = {
        // "idd": "f6588b4d3a274d599c8696e3a2e89579",
        // "name":"水"
        idd: 'f6588b4d3a274d599c8696e3a2e89579',
        lastName: 'Flintstone'
      };
      // alert()
      axios.post(`${base}/t-stu/testWarpper`, data
      )
      .then((response)=> {
        console.log(response);
      })
      .catch(function (error) {
        console.log(error);
      })
      .then(function () {
        // always executed
      });  
    }

后台代码：

@ResponseBody
    @RequestMapping(value="/testWarpper",method = RequestMethod.POST)
    public Map<String,Object> testWarpper(@RequestBody(required = false) Map paramMap){

        Map<String,Object> map = new HashMap<>();
        QueryWrapper<TStu> queryWrapper = new QueryWrapper<>();

        queryWrapper.eq("stuid",paramMap.get("idd").toString());
//        queryWrapper.eq("stuid",sid);
//        queryWrapper
        List<TStu>  list = tStuMapper.selectList(queryWrapper);

        map.put("result",list);
        return map;
    }

二、GET请求的方式
1.@RequestParam方式
前端：

ceshi = ()=>{

      let data = {
        // "idd": "f6588b4d3a274d599c8696e3a2e89579",
        // "name":"水"
        idd: 'f6588b4d3a274d599c8696e3a2e89579',
        lastName: 'Flintstone'
      };
      // alert()
      axios.get(`${base}/t-stu/testWarpper`,{params:data}
      )
      .then((response)=> {
        console.log(response);
      })
      .catch(function (error) {
        console.log(error);
      })
      .then(function () {
        // always executed
      });  
    }

后台：

@ResponseBody
    @RequestMapping(value="/testWarpper",method = RequestMethod.GET)
    public Map<String,Object> testWarpper(@RequestParam("idd") String sid){

        Map<String,Object> map = new HashMap<>();
        QueryWrapper<TStu> queryWrapper = new QueryWrapper<>();

//        queryWrapper.eq("stuid",paramMap.get("idd").toString());
        queryWrapper.eq("stuid",sid);
//        queryWrapper
        List<TStu>  list = tStuMapper.selectList(queryWrapper);

        map.put("result",list);
        return map;
    }
}

总结：
测试了axios.get不能用@RequestBody获取，能用@RequestParam获取。axios.post 可以用@RequestBody获取且不需要qs.stringify序列化，直接传对象就可以了。post请求后台用@RequestParam()获取的时候，前端需要用qs.stringify序列化所传递的参数