使用URLSearchParams处理axios发送的数据
使用URLSearchParams处理axios发送的数据
在使用axios这个ajax插件的时候,我们有些时候会遇到一些问题,比如:数据格式不正确
以最简单的例子为基础(这里使用post方法):

在上面的例子中我们直接调用axios的post方法,传给后台的参数为json格式,这和jquery的ajax写法相当类似!
但是,axios发送的数据格式和jquery ajax发送的默认数据格式却不相同,接下来让我们来看一下不同之处:
1.axios的数据类型

2.jquery ajax的数据类型

看到这里,有的小伙伴就要说了,修改下ContentType不就好了,其实不然,即时是修改了ContentType,数据依然不正确:
--------------------->
通过度娘的各种检索,终于找到了答案: 使用URLSearchParams来处理参数,URLSearchParams的兼容性并不高,所以使用的时候还是要注意(可以考虑使用babel来转换)
具体的操作如下:
----------------->
通过使用URLSearchParams的处理,我们就能像jquery ajax发送的数据一样了!!!
题外:
URLSearchParams具体是什么,能处理哪些东西,而它的API又有哪些?我这里贴点链接吧,大家可以更好的学习和理解~~~~
https://developer.mozilla.org/zh-CN/docs/Web/API/URLSearchParams#Browser_compatibility
https://segmentfault.com/a/1190000005980048
使用URLSearchParams处理axios发送的数据的更多相关文章
- 除了使用URLSearchParams处理axios发送的数据,但是兼容性不好,其他的兼容方法
在使用axios这个ajax插件的时候,我们有些时候会遇到一些问题,比如:数据格式不正确 以最简单的例子为基础(这里使用post方法): 在上面的例子中我们直接调用axios的post方法,传给后台的 ...
- 前端axios发送的数据后端接收不到(没有自动依赖注入)可能的原因
前端请求头content-type没有进行正确设置,后端无法解析该类型数据,比如说: 后端若想接收json类型的数据,则需要配置相应的转换器,(spring中可使用@RequestBody注解),若没 ...
- axios 发送json数据
var qs = require('qs'); axios.post(ajaxurl,qs.stringify({ username:'zhangsan', age:'18' })).then(fun ...
- axios发送post请求,如何提交表单数据?
axios发送post请求,提交表单数据的方式 默认情况下,axios将JavaScript对象序列化为JSON.要以application / x-www-form-urlencoded格式发送数据 ...
- vue 集成 axios 发送post请求 payload导致后台无法接收到数据问题
vue 集成axios之后,发送的post请求默认为payload 方式. 如果想改为正常的方式,需要增加headers头,并且将发送是数据json格式改为 querystring的方式. 安装依赖 ...
- vue-cli3.x中使用axios发送请求,配合webpack中的devServer编写本地mock数据接口(get/post/put/delete)
vue-cli3.x中使用axios发送请求,配合webpack中的devServer编写本地mock数据接口(get/post/put/delete) 手把手式笔记 Axios配置 安装 axios ...
- vue2.0项目实战(3)使用axios发送请求
在Vue1.0的时候有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2.0 之后,官方就不再更新 vue-resource. 关于为什么放弃推荐? -> 尤 ...
- Vue笔记:使用 axios 发送请求
在Vue1.0的时候有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2.0 之后,官方就不再更新 vue-resource. 关于为什么放弃推荐? -> 尤 ...
- vue2.0项目实战使用axios发送请求
在Vue1.0的时候有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2.0 之后,官方就不再更新 vue-resource. 关于为什么放弃推荐? -> 尤 ...
随机推荐
- 你想知道吗?come
从大二接触Java开始,到现在也差不多三个年头了.从最基础的HTML.CSS到最后的SSH自己都是一步一个脚印走出来的,其中开心过.失落过.寂寞过.虽然是半道出家但是经过自己的努力也算是完成了“学业” ...
- JavaScript属性(第三天)
js语法非常灵活,这致使他非常好用,也造成它比较难掌握的地方: js中的值类型与引用类型在这里不做过多介绍,可以参照其他语言. js是可以动态添加属性的: var person={}; person. ...
- Mybatis---架构图
- python入门——热量转换 I
热量转换 I 描述 卡路里,简称卡(Calorie),缩写为cal,定义为在1个大气压下,将1克水提升1摄氏度所需要的热量,卡是能量单位,被广泛使用在营养计量方面.国际能量标准单位是焦耳(joule) ...
- ST&倍增LCA
回顾st算法,它的一大功能是求区间最值.先将整个区间划分成若干个小的区间,求出最值,然后将小的区间合并成一个大的区间,我们这里要用到一个数组minn[i][j],划重点!如果我们要求的是区间最小值,m ...
- Docker系列(三)Dockerfile 离线构建镜像
一.Dockfile介绍: Dockfile是一种被Docker程序解释的脚本,Dockerfile由一条一条的指令组成,每条指令对应Linux下面的一条命令.Docker程序将这些Dockerfil ...
- MySQL高可用工具--orchestrator
orchestrator是一款MySQL高可用工具,其支持: 集群拓扑探测 集群拓扑重塑 故障恢复 提供3种使用方式: 命令行 HTTP API web页面 orchestator github地址
- C# 如何获取SQL Server 中指定数据表的所有字段名和字段类型
如何获取指定数据表的所有字段名和字段类型.SqlConnection.GetSchema方法有2个重载形式,获取指定数据表的所有字段名和字段类型的秘密就在GetSchema (String, Stri ...
- 简单的AOP标签
常用标签 1.1<aop:config> //作用 用于声明aop的配置 //配置:<aop:config></aop:config> 1.2 <aop:as ...
- 采用Anaconda平台调用pymc3时出现错误的解决方法
提示:(1)module 'theano' has no attribute 'gof',c++编辑出现错误 (2)stdio.h file not found 解决方法:(1)在终端中输入 xcod ...