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 ...
随机推荐
- Clion 连接 WSL 编译Unix环境
Clion 连接 WSL 编译Unix环境 安装 WSL Ubuntu 18版本,创建后不要换源,upgrade后安装CMake.g++.gcc 安装 Clion,创建项目 进入setting 在 B ...
- day02-搭建微服务基础环境01
搭建微服务基础环境01 1.创建父工程,用于聚合其他微服务模块 1.1创建父项目 说明:我们先创建一个父项目,该父项目会去管理多个微服务模块(module),如下: (1)File-New-Proje ...
- w11 U盘启动进PE看不到硬盘解决方法
w11 U盘启动进PE看不到硬盘解决方法 今天,因为要配系统,所以需要进pe,改配置文件,进去之后发现看不到系统盘,大吃一惊,然后各种找资料,最后,还是被我搞定了. 这里以戴尔为例,方法都差不多,先看 ...
- [大数据]ETL之增量数据抽取(CDC)
关于:转载/知识产权 本文遵循 GPL开源协议,如若转载: 1 请发邮件至博主,以作申请声明. 2 请于引用文章的显著处注明来源([大数据]ETL之增量数据抽取(CDC) - https://www. ...
- 微信Token验证代码的实现
微信开放第三方API接口, 申请地址: https://mp.weixin.qq.com/advanced/advanced?action=interface&t=advanced/inter ...
- Yii初学者必看-yii 表单验证规则
对yii深入了解总结出:希望对初学者有些帮助 Active Record (AR) 是一个流行的 对象-关系映射 (ORM) 技术. 每个 AR 类代表一个数据表(或视图),数据表(或视图)的列在 A ...
- 如何在现有项目中使用`Masa MiniApi`?
首先我们现有创建一个空的WebApi的项目模板,这个项目模板和MasaFramework本身没有任何关联,我们本博客只是使用的MasaFramework的MiniApi的包 创建Asp.NET Cor ...
- Java 的 SPI 机制
什么是SPI机制? SPI机制( Service Provider Interface)是Java的一种服务发现机制,为了方便应用扩展.那什么是服务发现机制?简单来说,就是你定义了一个接口,但是不提供 ...
- VUE3企业级项目基础框架搭建流程(1)
开发环境和技术栈 操作系统 windows11 开发工具 vscode.phpstudy(小皮):nginx1.15.11, mysql5.7.26, php7.4,Navicat for MySQL ...
- CVE-2015-5254漏洞复现
1.漏洞介绍. Apache ActiveMQ 是美国阿帕奇(Apache)软件基金会所研发的一套开源的消息中间件,它支持 Java 消息服务,集群,Spring Framework 等.Apache ...