vue --- axios发post请求后台接收不到参数的三种解决方案
最近用vue 做项目使用axios 发送post 请求时遇到了前端传数据后端接收不到的情况:

后来仔细对比发现axios传值是这样的:

而 ajax 传值是这样的:

一个 Request Payload , 一个Form data.
将Request payload 转为 from data 格式就可以了。有四种方式:
一:使用qs(推荐)
首先在你的项目里安装qs 模块。
npm install qs --save-dev
然后在需要使用的页面引入一下:
import qs from 'qs'
引入好了之后,把上面的postData用qs转一下再发送给后台就可以了:
let postData = qs.stringify({
certificationAccount: that.certificationAccount,
balance: that.balance
})
这样发送给后台时就是Format Data格式了。
二:使用URLSearchParams ;
let postData= new URLSearchParams()
postData.append('certificationAccount', that.certificationAccount)
postData.append('balance', that.balance)
这样也可以,个人觉得写起来麻烦。
三、直接使用字符串
let postData ='certificationAccount =' + that.certificationAccount + '&balance=' + that.balance
es6写法:
let postData = `
certificationAccount = ${that.certificationAccount}&balance=${that.balance}
`
四:JSON.stringify()
vue --- axios发post请求后台接收不到参数的三种解决方案的更多相关文章
- 微信小程序:使用wx.request()请求后台接收不到参数
问题描述: 微信小程序:wx.request()请求后台接收不到参数,我通过wx.request()使用POST方式调用请求,参数传递不到后台 解决方案: Content-Type': 'applic ...
- Vue简单封装axios—解决post请求后端接收不到参数问题
1.在src/下新建api文件夹,api/下新建index.js和public.js 在public.js中: import axios from 'axios'; import qs from 'q ...
- axios post请求后台接收不到参数 和 一些配置问题
原因: axios 的 headers的 content-type 默认是 “application/json ”,传给后台的格式是这样的: 但是后台接收数据的格式一般是表单格式的,就是formda ...
- spring mvc从后台往前台传参数的三种方式
第一种:使用Model对象(常用) 第一步:使用model对象往前台传递数据 第二步:在jsp中接收从后台传递过来的参数 第二种:使用HttpServletRequest对象 第一步:使用HttpSe ...
- MFC接收命令行参数的三种方法
方法一: CString sCmdline = ::GetCommandLine(); AfxMessageBox(sCmdline); 将获取到 "C:\test\app.exe -1 - ...
- axios发送post请求后台接受不到问题
axios发送post请求后台接受不到问题 1.首先这是前端的问题 2.解决方案不唯一,但这招肯定行 <!DOCTYPE html> <html> <head> & ...
- YbSoftwareFactory 代码生成插件【二十五】:Razor视图中以全局方式调用后台方法输出页面代码的三种方法
上一篇介绍了 MVC中实现动态自定义路由 的实现,本篇将介绍Razor视图中以全局方式调用后台方法输出页面代码的三种方法. 框架最新的升级实现了一个页面部件功能,其实就是通过后台方法查询数据库内容,把 ...
- struts2 Action 接收参数的三种方法
刚学Struts2 时 大家可能遇到过很多问题,这里我讲一下Action 接收参数的三种方法,我曾经在这上面摔过一回.所以要警醒一下自己..... 第一种:Action里声明属性,样例:account ...
- SpringBoot接收前端参数的三种方法
都是以前的笔记了,有时间就整理出来了,SpringBoot接收前端参数的三种方法,首先第一种代码: @RestController public class ControllerTest { //访问 ...
随机推荐
- [Vijos P1369]难解的问题
题目大意:给你一个序列,叫你求最长上升子序列长度,但必须包含第k项. 解题思路:我们把k左边的比a[k]大的数去掉,k右边的比k小的数去掉,就可以保证选到a[k]了(因为左边的数小于a[k],而a[k ...
- Linux Kernel 5.1 RC5发布
我们距离正式的Linux 5.1内核发布还有不到一个月的时间,而今天Linus Torvalds宣布推出预期的Linux Kernel 5.1 RC5版本.Linus Torvalds专门评论了Lin ...
- python学习--导入自己的包
定义一个自己的方法包: def myFunc(x): if x > 10: return x else: return -x 在需要的地方导入包: # 导入自定义的方法包 from learn ...
- ifram 实现左侧菜单,右侧显示内容
一般都是左侧的导航栏中的a标签中写一个target(a标签有target属性), 右侧的div标签中写一个iframe,在iframe中有name的属性,在左侧a标签中的target写上iframe中 ...
- 集团公司(嵌入ETL工具)財务报表系统解决方式
集团公司(嵌入ETL工具)財务报表系统解决方式 一.项目背景: 某集团公司是一家拥有100多家子公司的大型集团公司,旗下子公司涉及各行各业,包含:金矿.铜矿.房产.化纤等.因为子公司在业务上的差异.子 ...
- Android与设计模式——单例(Singleton)模式
概念: java中单例模式是一种常见的设计模式.单例模式分三种:懒汉式单例.饿汉式单例.登记式单例三种. 单例模式有一下特点: 1.单例类仅仅能有一个实例. 2.单例类必须自己自己创建自己的唯一实例. ...
- IIC总线协议基础1
文档类别 文档标识 IIC总线协议基础1 当前版本号 V0.2 作 者 Louis 完毕时间 2015-05-27 IIC总线协议基础1 IIC总线协议基础1. 1. II ...
- A. Ilya and Diplomas( Codeforces Round #311 (Div. 2) )
A. Ilya and Diplomas time limit per test 1 second memory limit per test 256 megabytes input standard ...
- 51nod-1131: 覆盖数字的数量
[传送门:51nod-1131] 简要题意: 给出A,B,表示有一个区间为A到B 给出X,Y,表示有一个区间为X到Y 求出X到Y中能够被A到B中的数(可重复)相加得到的不同的数的个数 题解: 乱搞题, ...
- 如何设置eclipse代码自动提示功能
如何设置eclipse代码自动提示功能 我们在刚安装完使用eclipse进行开发时,会发现没有代码提示会非常的不方便,下面小编将告诉你如何进行代码自动提示的设置. 工具/原料 eclipse 电脑 ...