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 异步页面查询实现代码(asp.net)
May 26 Javascript
js将控件隐藏及display属性的使用介绍
Dec 30 Javascript
提取jquery的ready()方法单独使用示例
Mar 25 Javascript
JavaScript清空数组元素的两种方法简单比较
Jul 10 Javascript
JavaScript实现文字跟随鼠标特效
Aug 06 Javascript
jquery实现鼠标悬浮停止轮播特效
Aug 20 Javascript
微信小程序 progress组件详解及实例代码
Oct 25 Javascript
javascript+html5+css3自定义提示窗口
Jun 21 Javascript
javascript简写常用的12个技巧(可以大大减少你的js代码量)
Mar 28 Javascript
用jquery获取select标签中选中的option值及文本的示例
Jan 25 jQuery
vue实现2048小游戏功能思路详解
May 09 Javascript
webpack分离css单独打包的方法
Jun 12 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
《神奇女侠:血脉》神力女超人大战犯罪公司
2020/04/09 欧美动漫
codeigniter框架The URI you submitted has disallowed characters错误解决方法
2014/05/06 PHP
PHP聚合式迭代器接口IteratorAggregate用法分析
2017/12/28 PHP
为jQuery.Treeview添加右键菜单的实现代码
2010/10/22 Javascript
JavaScript 程序编码规范
2010/11/23 Javascript
jquery 学习之二 属性 文本与值(text,val)
2010/11/25 Javascript
解析js中获得父窗口链接getParent方法以及各种打开窗口的方法
2013/06/19 Javascript
关于IE中getElementsByClassName不能用的问题解决方法
2013/08/26 Javascript
检查输入的是否是数字使用keyCode配合onkeypress事件
2014/01/23 Javascript
js 获取input点选按钮的值的方法
2014/04/14 Javascript
js实现键盘操作实现div的移动或改变的原理及代码
2014/06/23 Javascript
js面向对象之静态方法和静态属性实例分析
2015/01/10 Javascript
JavaScript之Object类型介绍
2015/04/01 Javascript
实战node静态文件服务器的示例代码
2018/03/08 Javascript
解决Angular2 router.navigate刷新页面的问题
2018/08/31 Javascript
微信小程序出现wx.getLocation再次授权问题的解决方法分析
2019/01/16 Javascript
layui问题之模拟table表格中的选中按钮选中事件的方法
2019/09/20 Javascript
js简单实现自动生成表格功能示例
2020/06/02 Javascript
JS实现联想、自动补齐国家或地区名称的功能
2020/07/07 Javascript
python去除字符串中的换行符
2017/10/11 Python
Python使用xpath实现图片爬取
2020/09/16 Python
python装饰器代码深入讲解
2021/03/01 Python
Html5饼图绘制实现统计图的方法
2020/08/05 HTML / CSS
Ivory Isle Designs美国/加拿大:婚礼和活动文具公司
2018/08/21 全球购物
师范生实习自我鉴定
2013/11/01 职场文书
计算机应用专业推荐信
2013/11/13 职场文书
公务员总结性个人自我评价
2013/12/05 职场文书
校园十佳歌手策划书
2014/01/22 职场文书
《骑牛比赛》教后反思
2014/04/22 职场文书
业务员辞职信范文
2015/03/02 职场文书
个人催款函范文
2015/06/24 职场文书
结婚幸福感言
2015/08/01 职场文书
2016年第104个国际护士节活动总结
2016/04/06 职场文书
golang中的空接口使用详解
2021/03/30 Python
python实现MD5进行文件去重的示例代码
2021/07/09 Python
微信小程序 根据不同用户切换不同TabBar
2022/04/21 Javascript