版权声明:未经同意,不得随意转载转载 https://blog.csdn.net/lucky541788/article/details/84877481
最近用vue做项目使用axios发送post请求时遇到了前端传数据后端接收不到的情况:
代码:
后来仔细对比ajax发现axios传值是这样的:
而ajax传值是这样的:
一个Request Payload,一个Form Data。
将Request Payload 转为Form Data格式就可以了,有三种方式:
一、使用qs
首先在你的项目里安装qs模块:
npm install qs --save-dev
然后在需要使用的页面引入一下:
import qs from 'qs'
引入好了之后,把上面的postData用qs转一下再发送给后台就可以了:
let postData = qs.stringify({
phone: this.loginPhone,
password: this.loginPassword
});
axios({
url: ' ',
method: 'post',
data: postData
})
.then(res => {
console.log(res.data);
})
这样发送给后台时就是Format Data格式了。
二、使用FormData
// 基于vue的形式
var form = new FormData();
form.append('name', this.name);
form.append('phone', this.phone);
form.append('sex', this.sex);
form.append('photo', this.img);
form.append('user_address', this.address);
let config = {
headers: {'Content-Type': 'multipart/form-data'}
}; //添加请求头
if (this.$refs.person.validate()) {
this.$http.post('url', form, config)
.then(response => {
console.log(response.data);
})
}