axios链接带参数_Axios post 传参的params 与data 的两种形式【详解】[vue]

this.$axios({

url: '/api/user/login' ,

method: 'post',

headers: {

'Content-Type': 'application/json'

},

data:{

username: this.user,

pwd: this.pwd

}

}).then((res) => {

console.log(res)

})

第二种：params方式

this.$axios({

url: '/api/user/login' ,

method: 'post',

headers: {

'Content-Type': 'application/json'

},

params:{

username: this.user,

pwd: this.pwd

}

}).then((res) => {

console.log(res)

})

注：直接使用post方法，传递的参数为 data 的方式

代码如下：

this.$axios.post('/api/user/login',{username: this.user, pwd: this.pwd }),

{

headers: {

'Content-Type': 'application/json'

}

}).then((res) => {

console.log(res)

使用场景

一般，情况下都是使用 data 的传参方式，但有时会发现需要使用 params 的方式，后台才能获取到数据，这与后台的接口有关，我们前端不能控制。如Java接口

若使用 Map 接收参数，必须使用 @RequestParam修饰。但是如果想传list类型的数据，需要使用单独的方法处理(参考链接)。

若使用 data 传递参数，必须使用一个实体类接收参数，而且需要添加注解 @RequestBody进行修饰