vue项目中 axios 的 post 请求使用 formdata 传参

cppprimer 发布于2019-08-26 13:51 / 1755人阅读

摘要：最近做的项目，后端用的接收参数。由于以前一直用的传参，这块还真没怎么研究过。于是万变不离其宗，看文档咯。

最近做的项目，后端用的 formData 接收参数。
由于以前一直用的 payload 传参，这块还真没怎么研究过。于是万变不离其宗，看文档咯。
方法很直接，人狠话不多：
进入 https://github.com/axios/axios 直接搜索 formData

看到如下：

所以说，直接修改全局配置，增加 transformRequest 配置处理就可以咯：

import axios from "axios"
import Qs from "qs"

let http = axios.create({
  transformRequest: [function (data, headers) {
    // Do whatever you want to transform the data
    return Qs.stringify(data);
  }],
})

好了，是不是so easy！只能再次说明：文档很重要！

本质上说，formData 和 payload 的区别就是：前者是字符串，后者是一个 json 对象，所以在请求之前把参数用 Qs 模块转变成字符串就可以咯

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/109667.html

iMap | 一款基于 Electron 和 Vue 的跨平台旅行地图生成器

摘要：请求错误请求代码封装与基本一致，只是将换成即可。关于的使用是个能把组件的共享状态抽取出来，当做一个全局单例模式进行管理。首先确保你的已经安装，运行来安装。项目地址：https://huangxizhou.com/project/iMap 技术栈 Vue.js Vuex Axios Webpack Leancloud（express） Echarts Electron（electr...

dingda 2019-08-21 17:03 评论0 收藏0
axios的使用

摘要：但是如果你想以的方式传参，则需要做一点改变参考这里注意如果你的请求方法是，又规定了参数格式是，则必须要使用下面这些方法中的一种。 axios是vue官方推荐的http库，详情见官方中文文档。安装： npm install axios 安装依赖： npm install --save axios vue-axios 配置模板： //main.js中 import Vue from vu...

lieeps 2019-08-22 16:23 评论0 收藏0
vue中axios请求的封装

摘要：整合，最终得到的对象如下注意模块名和没有了，所以需要注意命名的唯一，以免覆盖。如下，，由于我司后台提供的接口大都是和，所以只考虑了这两种请求方式在中创建一个，并在中引用发送请求 1.发送请求模块目录 showImg(https://segmentfault.com/img/bVbqjgU?w=203&h=180); 2.@/api/url中存放的是每个模块的URL // 商品模块 pr...

hover_lew 2019-08-23 16:18 评论0 收藏0
Vue开发总结及一些最佳实践（已更新）

摘要：基本开发环境创建的项目，作为代码编写工具插件推荐插件配置文章目录项目目录结构介绍框架选择处理请求二次封装项目目录结构简介业务相关静态文件全局组件基础样式布局样式及工具引入请求配置路由全局状态管理工具文件入口文件主要配置文件页面检查配置测试基本开发环境 vue-cli3 创建的项目，vscode 作为代码编写工具vscode插件推荐：vscode 插件配置文章目录项目目录结构介绍...

NotFound 2019-08-26 13:47 评论0 收藏0
七牛云上传及上传方法封装

摘要：分片及七牛云上传封装项目里面用到七牛云，有分片和简单上传在此做下简单的记录，分享下面是分片上传封装是我写在里面分片的大小如分片项目是框架，请求是。分片及七牛云上传封装项目里面用到七牛云，有分片和简单上传在此做下简单的记录，分享下面是分片上传封装 process.env.MAX_FILESIZE 是我写在config里面分片的大小如1024102410 10MB分片项目是vue...

Muninn 2019-08-26 13:33 评论0 收藏0