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 相关文章推荐
form中限制文本字节数js代码
Jun 10 Javascript
javascript 基础篇1 什么是js 建立第一个js程序
Mar 14 Javascript
php实例分享之实现显示网站运行时间
May 20 Javascript
Javascript中设置默认参数值示例
Sep 11 Javascript
jquery实现动静态条形统计图
Aug 17 Javascript
Bootstrap网格系统详解
Apr 26 Javascript
jquery实现图片上传前本地预览功能
May 10 Javascript
基于jquery插件实现拖拽删除图片功能
Aug 27 Javascript
教你如何在Node.js中使用jQuery
Aug 28 Javascript
AngularJS 中的数据源的循环输出
Oct 12 Javascript
详解vue项目中调用百度地图API使用方法
Apr 25 Javascript
js遍历详解(forEach, map, for, for...in, for...of)
Aug 28 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删除文本文件中重复行的方法
2015/04/28 PHP
用PHP生成excel文件到指定目录
2015/06/22 PHP
PHP设计模式之迭代器模式Iterator实例分析【对象行为型】
2020/04/26 PHP
彪哥1.1(智能表格)提供下载
2006/09/07 Javascript
js focus不起作用的解决方法(主要是因为dom元素是否加载完成)
2010/11/05 Javascript
jQuery Animation实现CSS3动画示例介绍
2013/08/14 Javascript
一个js过滤空格的小函数
2014/10/10 Javascript
javascript中传统事件与现代事件
2015/06/23 Javascript
js如何实现淡入淡出效果
2020/11/18 Javascript
Laydate时间组件在火狐浏览器下有多时间输入框时只能给第一个输入框赋值的解决方法
2016/08/18 Javascript
JavaScript DOM元素常见操作详解【添加、删除、修改等】
2018/05/09 Javascript
详解微信小程序之提高应用速度小技巧
2020/01/07 Javascript
vue+vant实现商品列表批量倒计时功能
2020/01/13 Javascript
JavaScript使用canvas绘制随机验证码
2020/02/17 Javascript
JavaScript实现PC端四格密码输入框功能
2020/02/19 Javascript
使用Angular9和TypeScript开发RPG游戏的方法
2020/03/25 Javascript
angular共享依赖的解决方案分享
2020/10/15 Javascript
node koa2 ssr项目搭建的方法步骤
2020/12/11 Javascript
TensorFlow平台下Python实现神经网络
2018/03/10 Python
详谈pandas中agg函数和apply函数的区别
2018/04/20 Python
详解django中url路由配置及渲染方式
2019/02/25 Python
Django 自定义分页器的实现代码
2019/11/24 Python
Python识别html主要文本框过程解析
2020/02/18 Python
详解python环境安装selenium和手动下载安装selenium的方法
2020/03/17 Python
python plt可视化——打印特殊符号和制作图例代码
2020/04/17 Python
Python selenium如何打包静态网页并下载
2020/08/12 Python
python 如何实现遗传算法
2020/09/22 Python
html5 兼容IE6结构的实现代码
2012/05/14 HTML / CSS
大学生期末自我鉴定
2014/02/01 职场文书
乡镇庆八一活动方案
2014/02/02 职场文书
房产公证书范本
2014/04/10 职场文书
发展党员工作情况汇报
2014/10/28 职场文书
委托证明范本
2014/11/25 职场文书
国情备忘录观后感
2015/06/04 职场文书
师德师风培训感言
2015/08/03 职场文书
详解Spring事件发布与监听机制
2021/06/30 Java/Android