关于使用axios发送请求，后台无法正常接收参数（为null）

let data = {
    "id": row.id
}

this.$axios.post('/api/quartz/pause', data).then(function(res){
    $this.$message({
        showClose: true,
        message: '任务：' + row.taskName + "已暂停",
        type: 'success'
    });
},function(){
    console.log('failed');
    $this.$message({
        showClose: true,
        message: '暂停操作失败',
        type: 'error'
    });
});

后台接受的id为null
当使用axios发送一个简单的post请求时，后端说取不到我的id和对应的值，然后我找了一下资料，终于把值成功传过去，后端也成功取到了。
原因：后端用的框架是 spring mvc ，并且在这个方法上使用了注解 @RequestParam，这个就只能从请求的地址中取出参数，也就是只能从 username=admin&pwd=11111 这种字符串中解析出参数，也就是编码格式（content-type）为：application/x-www-form-urlencode。（表单form的enctype属性的编码方式有两种：application/x-www-form-urlencode和multipart/form-data），但是axios会把请求的数据转换成json格式，即为：application/json;charset=UTF-8，所以格式不同，就取不值了。

解决办法：

首先安装qs

qs 是一个增加了一些安全性的查询字符串解析和序列化字符串的库

npm install qs / cnpm install qs (安装了淘宝镜像的才可以使用)

qs 全局引入

//在main.js引入qs  
import qs from  'qs'  

//配全局属性配置，在任意组件内可以使用this.$qs获取qs对象 
Vue.prototype.$qs = qs

 

qs使用方法：

转为对象

console.log(qs.parse(url));

const a = {name:'hehe',age:10};

转为url参数形式

console.log(qs.stringify(a))

 

此时，只需将之前的data数据使用qs序列化

let data = this.$qs.stringify({
    "id": row.id
})

    @RequestMapping("/pause")
    public String pause(Integer id) throws SchedulerException {
        myScheduler.pauseScheduler(id);
        return "success";
    }

测试：后台id可以接收到