input 文件上传 formdata
需求背景
后端给定接口 传xlsx文件
参数:后台需要的参数
格式: formdata
需要 token
1 saveEditIn (e) {
2 this.sheetAll = []
3 // 判断文件大小
4 let allowSize = 1024 * 1024 * 10
5 let files = e.target.files[0]
6 let accSize = files.size
7 if (accSize > allowSize) {
8 eipModal.warning({
9 message: '温馨提示',
10 content: '文件大小不允许超过10M'
11 })
12 return
13 }
14 this.getFileRes(files)
15 },
1 getFileRes (file) {
2 let fd = new FormData()
3 fd.append("file", file)
4 // 后台需要的参数
4 fd.append("uid", "参数")
5 fd.append("fieldName", "xxxxxxx")
6 fd.append("gid", 'xxxxxxx')
7 fd.append("bizName", "xxxxxx")
8 axios.post(self.api.uploadFiles, fd,
9 {
10 headers: {
11 'Content-type': 'multipart/form-data',
12 Authorization: token16 }
17 }).then((res) => {
18 console.log(res);
19 }).catch((err) => {
20 if (typeof err === 'string') {
21 eipModal.error({
22 title: '温馨提示',
23 content: err
24 });
25 }
26 })
27},
input 文件上传 formdata的更多相关文章
- 自定义input文件上传样式
前言 文件上传是我们经常会用到的功能,但是原生的input样式太丑了,能不能自定义一个input文件上传样式呢?我这里写了两种方法,form表单提交跟ajax异步提交都没有问题,自动上传或者点击上传按 ...
- input文件上传(上传单个文件/多选文件/文件夹、拖拽上传、分片上传)
//上传单个/多个文件 <input title="点击选择文件" id="h5Input1" multiple="" accept= ...
- ajax文件上传-FormData()
HTML: <form action=""> <input type="file" id="file1" name=&qu ...
- input 文件上传
<button class="blueButton fileinput-button" style="width:165px;" @click=" ...
- 文件上传FormData
<div class="modal-dialog"> <div class="modal-content"> <div class ...
- 自定义input文件上传 file的提示文字及样式
简单记录一下 效果图: 代码: <input class="aload" type='button' value='上传附件' onClick='javascript:$(& ...
- vue使用formData进行文件上传
本文为博主原创,未经允许不得转载 1.vue页面 <ux-form ref="formRef" layout="vertical"> <ux- ...
- 基于uploadify.js实现多文件上传和上传进度条的显示
uploadify是JQuery的一个插件,主要实现文件的异步上传功能,可以自定义文件大小限制.文件类型.是否自动上传等属性,可以显示上传的进度条.官网地址是http://www.uploadify. ...
- 【JS】ajax 实现无刷新文件上传
一.摘要 最近在做个东西,需要实现页面无刷新文件上传,目前看到的方法有两种 1) 通过隐藏iframe 实现页面无刷新,适用于不关心上传结果 <form target="hiddenF ...
- python 全栈开发,Day86(上传文件,上传头像,CBV,python读写Excel,虚拟环境virtualenv)
一.上传文件 上传一个图片 使用input type="file",来上传一个文件.注意:form表单必须添加属性enctype="multipart/form-data ...
随机推荐
- abp(net core)+easyui+efcore实现仓储管理系统——ABP升级7.3下(五十九)
Abp(net core)+easyui+efcore实现仓储管理系统目录 abp(net core)+easyui+efcore实现仓储管理系统--ABP总体介绍(一) abp(net core)+ ...
- 【ACM数论】和式变换技术,也许是最好的讲解之一
在做数论题时,往往需要进行和式变换,然后变换成我们可以处理的和式,再针对和式做筛法.整除分块等操作. 本文将介绍一些常见的和式变换技术. 以下出现的概念大部分为个人总结,未必是学术界/竞赛界的统一说法 ...
- WPF 界面布局、常用控件入门教程实例 WPF入门学习控件快速教程例子 WPF上位机、工控串口通信经典入门
WPF(Windows Presentation Foundation)是一种用于创建 Windows 桌面应用程序的框架,它提供了丰富的控件库和灵活的界面布局,可以创建现代化的用户界面.下面是 WP ...
- pysimplegui之使用多线程,避免程序卡死
这个问题我也遇到过,就是还需要一个while循环的时候,放到gui本身循环会卡死,这时候就需要启动多线程 需要"长时间"的操作 如果您是 Windows 用户,您会在其标题栏中看到 ...
- day103:MoFang:用户登录部分:客户端提交登录信息&APICloud集成防水墙验证码&保存用户登录状态
目录 bug:修复jsonrpc修改源码以后celery无法运行的问题 1.客户端提交登录信息 2.在APICloud中集成防水墙验证码 3.保存用户登录状态 bug:修复jsonrpc修改源码以后c ...
- TS(二)内置对象与class类
内置对象 ECMA内置对象 Boolean.Number.String.RegExp.Date.Error const regexp:RegExp = /\w\d\s const number:Num ...
- Linux(五)用户管理与文件权限
1 常用的基本命令 Shell可以看作一个命令解释器,为我们提供一个交互式的文本控制台界面,可以通过终端控制台来输入命令,由shell进行解释并最终交给linux内核运行.可以看作用户和硬件的桥梁. ...
- 【Vue项目】商品汇前台(二)进度条插件+Vuex模块化仓库+函数的防抖与节流+路由传参
前言 1 nprogress进度条的使用 当请求发出进度条出现并向前走,请求成功后进度条消失.nprogress是一种进度条插件 1.1 nprogress进度条插件安装 npm i --save n ...
- DRF版本控制(源码分析)
DRF中版本控制的五种情况(源码分析) 在restful规范中要去,后端的API中需要体现版本. drf框架中支持5种版本的设置. 1. URL的GET参数传递(*) 示例: user/?versio ...
- Docker入门实践笔记-基本使用
容器是一个系统中被隔离的特殊环境,进程可以在其中不受干扰地运行,使用Docker来实现容器化 容器化 运行容器时,要先拉取一个镜像(image),再通过这个镜像来启动容器: $ sudo docker ...