axios使用post方式请求出现400
在vue中如果直接使用与ajax的参数传递方式类型是不正确的,需要转化,方式有两种
1:使用 new URLSearchParams()构造参数
let params = new URLSearchParams();
params.append('key1', 'value1'); //你要传给后台的参数值 key/value
params.append('key2', 'value2');
params.append('key3', 'value3');
this.$axios({
method: 'post',
url:url,
data:params
}).then((res)=>{ });
2.使用qs
npm install qs --save
import qs from 'qs'
Vue.prototype.$qs = qs
let postData = this.$qs.stringify({
key1:value1,
key2:value2,
key3:value3,
});
this.$axios({
method: 'post',
url:'url',
data:postData
}).then((res)=>{
});
axios使用post方式请求出现400的更多相关文章
- 05: 使用axios/vue-resource发送HTTP请求
1.1 axios 简介与安装 1.axios简介 1. vue本身不支持发送AJAX请求,需要使用vue-resource.axios等插件实现 2. axios是一个基于Promise的HTTP请 ...
- 使用Typescript重构axios(二十七)——添加请求状态码合法性校验
0. 系列文章 1.使用Typescript重构axios(一)--写在最前面 2.使用Typescript重构axios(二)--项目起手,跑通流程 3.使用Typescript重构axios(三) ...
- Vuex、axios、跨域请求处理和import/export的注意问题
一.Vuex 1.介绍 vuex是一个专门为Vue.js设计的集中式状态管理架构. 对于状态,我们把它理解为在data中需要共享给其他组件使用的部分数据. Vuex和单纯的全局对象有以下不同: 1. ...
- axios发送两次请求原因及解决方法
axios发送两次请求原因及解决方法 最近Vue项目中使用axios组件,在页面交互中发现axios会发送两次请求,一种请求方式为OPTIONS,另外一种为自己设置的. 如图: 什么是CORS通信? ...
- 使用Typescript重构axios(二十二)——请求取消功能:收尾
0. 系列文章 1.使用Typescript重构axios(一)--写在最前面 2.使用Typescript重构axios(二)--项目起手,跑通流程 3.使用Typescript重构axios(三) ...
- 【axios】get/post请求params/data传参总结
axios中get/post请求方式 1. 前言 最近突然发现post请求可以使用params方式传值,然后想总结一下其中的用法. 2.1 分类 get请求中没有data传值方式 2.2 get请求 ...
- axios源码解析 - 请求方法的别名实现
axios中的创建请求方式很多,比如axios(url),axios.get(url),axios.post(url),axios.delete(url),方便快捷的api设计让axios火得一塌糊涂 ...
- JAVA Socket 实现HTTP与HTTPS客户端发送POST与GET方式请求
JAVA Socket 实现HTTP与HTTPS客户端发送POST与GET方式请求 哇,一看标题怎么这么长啊,其实意思很简单,哥讨厌用HTTP Client做POST与GET提交 觉得那个毕竟是别人写 ...
- Ajax-(get/post/jQuery方式请求)
< !DOCTYPE html > < html xmlns = "http://www.w3.org/1999/xhtml" > < head &g ...
随机推荐
- c语言推箱子 扫雷项目
推箱子 两关的推箱子用到一个三维数组 用到的图片数据如下 https://pan.baidu.com/s/1IDE4GQLo46cxNywDqwxmlQ 密码:jdel 代码如下: #include& ...
- Linux权限管理(7)
权限的基本介绍: rwx权限详解: rwx作用到文件: [r]:代表可读,可以读取.查看 [w]:代表可写,可以修改,但不代表可以删除该文件,删除一个文件的前提条件是对该文件所在的目录有写权限才能删除 ...
- .NET Core 小程序开发零基础系列(2)——小程序服务通知(模板消息)
基于上一篇文件“.NET Core 小程序开发零基础系列(1)——开发者启用并校验牵手成功”的反映,个人觉得效果很不错,大家对公众号开发还是有很大需求的,同时也收到了很多同学的问题,后面我也会通过实战 ...
- C#使用iTextSharp给PDF文件加水印
给PDF添加水印,可以用iTextSharp. 步骤1:下载iTextSharp 步骤2:在项目中添加引用itextsharp.dll 步骤3:在程序中使用iTextSharp.text.pdf us ...
- 初尝RabbitMQ消息队列
RabbitMQ 是什么? 消息中间件 作用? 用于分布式项目中的模块解耦 用法? 创建队列 创建消息工厂并设置 (生产者额外步骤 : 创建消息) 创建连接,通道 声明队列 生产者 : 发送消 ...
- Python--编码与字符串
为什么字符串要编码呢? 因为计算机只能处理数字,最底层的CPU只能识别0和1.所以字符串就需要编码成对应的数字. 在计算机中,最开始只有ASCII,我们开始接触计算机编程时就学了ASCII码.最早只有 ...
- netty源码解解析(4.0)-20 ChannelHandler: 自己实现一个自定义协议的服务器和客户端
本章不会直接分析Netty源码,而是通过使用Netty的能力实现一个自定义协议的服务器和客户端.通过这样的实践,可以更深刻地理解Netty的相关代码,同时可以了解,在设计实现自定义协议的过程中需要解决 ...
- HTML(三)链接,<head>,css样式
HTML链接 HTML 超链接 一个未访问过的链接显示为蓝色字体并带有下划线 访问过的链接显示为紫色并带有下划线 点击链接时,链接显示为红色并带有下划线 注意:如果为这些超链接设置了 CSS 样式,展 ...
- 传入值参数&传入引用参数的区别
传值&传引用 1.传值 是把实参的值赋值给行参 那么对行参的修改,不会影响实参的值 2.传地址 是传值的一种特殊方式,只是他传递的是地址 那么传地址以后,实参和行参都指向同一个对象 3.传引用 ...
- QFramework 使用指南 2020(七):Res Kit (1)概述与基本使用
在上一篇,我们刚刚结束了 脚本生成专题,我们知道 QF 提供了两种脚本生成模式,一种是 ViewController + Bind ,另一种是 UI Kit 模式. 本来打算,介绍完 ViewCont ...