vueaxiospost发送复杂对象问题-创新互联
一、项目情形

现在vue项目中,一般使用axios发送请求去后台拉取数据。
在某些业务场景中,前端需要在某个字段中发送一个复杂的嵌套对象给后台做保存并处理。虽然axios可配置发送方式(post/get等),但如果不做其他配置,post的数据其实也是拼在请求地址后面,而这种传输方式会有很多问题:一是可能数据丢失,二是get传送的数据长度有limit,如果需要保存大段的中文,会报错;三是数据不直观,复杂对象的格式会出现问题。
二、解决方案
怎么实现使用post方法时,能实现formData方式提交,而且整个请求数据格式能像queryString一样直观。
使用QS将数据序列化
//main.js
import axios from 'axios';
Vue.prototype.$axios = axios; // 配置axios的访问方式
//demo.vue
import Qs from qs;
this.$axios({
method: "post",
url: "url",
data: reqData,
transformRequest: [ function(data){
return Qs.stringify(data) //使用Qs将请求参数序列化
}],
headers: {
'Content-Type': 'application/x-www-form-urlencoded' //必须设置传输方式
}
}).then((res)=>{
//逻辑代码
} 本文题目:vueaxiospost发送复杂对象问题-创新互联
文章分享:http://www.scyingshan.cn/article/cchgio.html


咨询
建站咨询
