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()

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏javascript趣味编程

[物联网loT]树莓派实现局域网内LED亮灭

[思路]:树莓派安装express服务器,访问服务器,与服务器交互,从而控制硬件,最终实现树莓派引脚电平控制,进而实现与树莓派电路板引脚相连的LED亮与灭。 ...

14630
来自专栏京程一灯

为什么我喜欢JavaScript的Optional Chaining[每日前端夜话0xB0]

JavaScript 的特性极大地改变了你的编码方式。从 ES2015 开始,对我代码影响最多的功能是解构、箭头函数、类和模块系统。

10630
来自专栏大史住在大前端

Vue+ElementUI项目使用webpack输出MPA

为另一个项目提供可嵌入的功能单页,大部分页面使用时都是独立功能页,个别页面带有左侧边栏(相当于3-4个页面的整合形态),由于资源定位地址的限定,每个页面打包为单...

14820
来自专栏Java3y

AJAX常见面试题(修订版)

AJAX是“Asynchronous JavaScript and XML”的缩写。他是指一种创建交互式网页应用的网页开发技术。、

7210
来自专栏Jerry的SAP技术分享

如何处理SAP Fiori Launchpad KPI tile点击后出现的错误消息

点击了SAP Fiori Launchpad KPI tile后一个典型的错误消息:

9830
来自专栏Java3y

XML和JSO的面试题(修订版)

JSON:JavaScript Object Notation 【JavaScript 对象表示法】.

9930
来自专栏Java3y

从零开始学JSON(修订版)

JSON:JavaScript Object Notation 【JavaScript 对象表示法】

7220
来自专栏Java3y

三分钟学会门面模式!

上一次分享了一篇好文:《为什么阿里巴巴禁止工程师直接使用日志系统(Log4j、Logback)中的 API》

9230
来自专栏Nodejs技术栈

数据结构知否知否系列之 — 队列篇

队列,英文 First In First Out 简称 FIFO,遵从先进先出的原则,与 “栈” 相反,在队列的尾部添加元素,在队列的头部删除元素,如果队列中没...

8020
来自专栏Jerry的SAP技术分享

Embedded Server nano - NanoHTTPD.java学习

Default threading strategy for NanoHTTPD. By default, the server spawns a new T...

11130

扫码关注云+社区

领取腾讯云代金券

年度创作总结 领取年终奖励