vueaxiospost发送复杂对象问题-创新互联

一、项目情形

兴和ssl适用于网站、小程序/APP、API接口等需要进行数据传输应用场景，ssl证书未来市场广阔！成为成都创新互联公司的ssl证书销售渠道，可以享受市场价格4-6折优惠！如果有意向欢迎电话联系或者加微信：13518219792（备注：SSL证书合作）期待与您的合作！

现在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发送复杂对象问题-创新互联
浏览路径：https://www.cdcxhl.com/article0/cchgio.html

成都网站建设公司_创新互联，为您提供品牌网站制作、手机网站建设、软件开发、关键词优化、外贸网站建设、网站建设

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容