axios发送post请求,提交图片类型表单数据方法


Posted in Javascript onMarch 16, 2018

DOME

<input type="file" @change="upload" ref="upload">

接口

const userUploadAtt = (File,config) => axios.post("接口",File,config)

处理数据

let input = this.$refs.upload 
创建一个空的FormData对象 
let data = new FormData();
使用FormData.append来添加键/值对到表单里面;
data.append('file', input.files[0]);
upload(){
 userUploadAtt(data,{headers: {'Content-Type': 'multipart/form-data'}}).then((response)=>{
  this.headPhoto = response.data[0].msg.url;
 }).catch(()=>{
 })
}

注意:

如果

axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8'
post请求时候表单上传不需要引入qs.stringify()

以上这篇axios发送post请求,提交图片类型表单数据方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript tips提示框组件实现代码
Nov 19 Javascript
JQuery 操作/获取table具体代码
Jun 13 Javascript
jQuery 借助插件Lavalamp实现导航条动态美化效果
Sep 27 Javascript
网页广告中JS代码的信息监听示例
Apr 02 Javascript
PHP中使用微秒计算脚本执行时间例子
Nov 19 Javascript
JavaScript实现大数的运算
Nov 24 Javascript
详解微信小程序入门五: wxml文件引用、模版、生命周期
Jan 20 Javascript
超全面的JavaScript开发规范(推荐)
Jan 21 Javascript
JS面试题大坑之隐式类型转换实例代码
Oct 14 Javascript
深入了解query和params的使用区别
Jun 24 Javascript
js实现页面导航层级指示效果
Aug 25 Javascript
Vue使用CDN引用项目组件,减少项目体积的步骤
Oct 30 Javascript
Vue实现搜索 和新闻列表功能简单范例
Mar 16 #Javascript
vue axios 表单提交上传图片的实例
Mar 16 #Javascript
vue中实现图片和文件上传的示例代码
Mar 16 #Javascript
vue中手机号,邮箱正则验证以及60s发送验证码的实例
Mar 16 #Javascript
Vue实现active点击切换方法
Mar 16 #Javascript
详解Vue.js项目API、Router配置拆分实践
Mar 16 #Javascript
vue实现tab切换外加样式切换方法
Mar 16 #Javascript
You might like
奇怪的PHP引用效率问题分析
2012/03/23 PHP
PHP获取指定函数定义在哪个文件中以及其所在的行号实例
2014/05/08 PHP
PHP反向代理类代码
2014/08/15 PHP
Smarty foreach控制循环次数的一些方法
2015/07/01 PHP
php curl上传、下载、https登陆实现代码
2017/07/23 PHP
thinkPHP5框架实现基于ajax的分页功能示例
2018/06/12 PHP
js 操作css实现代码
2009/06/11 Javascript
Jquery ui css framework
2010/06/28 Javascript
10个基于浏览器的JavaScript调试工具分享
2013/02/07 Javascript
jquery对dom的操作常用方法整理
2013/06/25 Javascript
JS动态添加iframe的代码
2015/09/14 Javascript
js中不同的height, top的区别对比
2015/09/24 Javascript
NodeJs的优势和适合开发的程序
2016/08/14 NodeJs
浅谈jQuery为哪般去掉了浏览器检测
2016/08/29 Javascript
Vue.js计算属性computed与watch(5)
2016/12/09 Javascript
bootstrap为水平排列的表单和内联表单设置可选的图标
2017/02/15 Javascript
vue2.0嵌套路由实现豆瓣电影分页功能(附demo)
2017/03/13 Javascript
微信小程序实现折叠与展开文章功能
2018/06/12 Javascript
layer弹出子iframe层父子页面传值的实现方法
2018/11/22 Javascript
Node使用Selenium进行前端自动化操作的代码实现
2019/10/10 Javascript
jQuery--遍历操作实例小结【后代、同胞及过滤】
2020/05/22 jQuery
[03:12]TI9战队档案 - Virtus Pro
2019/08/20 DOTA
简单讲解Python中的字符串与字符串的输入输出
2016/03/13 Python
深入解析Python的Tornado框架中内置的模板引擎
2016/07/11 Python
Python利用pandas处理Excel数据的应用详解
2019/06/18 Python
在pycharm中显示python画的图方法
2019/08/31 Python
python列表生成器迭代器实例解析
2019/12/19 Python
Python使用configparser库读取配置文件
2020/02/22 Python
pyinstaller打包单文件时--uac-admin选项不起作用怎么办
2020/04/15 Python
python实现斗地主分牌洗牌
2020/06/22 Python
opencv 图像轮廓的实现示例
2020/07/08 Python
详解python模块pychartdir安装及导入问题
2020/10/22 Python
哥德堡通行证:Gothenburg Pass
2019/12/09 全球购物
某/etc/fstab文件中的某行如下: /dev/had5 /mnt/dosdata msdos defaults,usrquota 1 2 请解释其含义
2013/09/18 面试题
《颐和园》教学反思
2016/02/19 职场文书
Python面向对象之成员相关知识总结
2021/06/24 Python