前端element ui 文件base64加密字符串 上传
<el-form-item label="附件" prop="attachment">
<el-upload
:multiple="false"
:limit="1"
:on-exceed="handleExceed"
:http-request="uploadFiles"
:on-remove="handleRemoveFj"
action=" "
>
<el-button slot="trigger" size="small" type="primary" >选择文件</el-button>
<el-button v-show="formData.attachment != null" > <a :href="'http:/localhost:8080/file'+formData.attachment">查看文件</a></el-button>
</el-upload>
</el-form-item>
//图片上传数量校验
handleExceed(files, fileList) {
this.$message.warning(`当前限制选择 1 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
},
//取消上传文件
handleRemoveFj(file,fileList){
this.formData.fileContent = null;
}, //文件上传
uploadFiles(data) {
// this.formData.fileUpdate=1; //更新状态 改为已更新
this.formData.fileName = data.file.name; //文件名
this.formData.fileType = "updateNoticeFile";
this.getBase64(data.file).then(resBase64 => {
this.formData.fileContent = resBase64.split(',')[1]
console.info(this.formData.fileContent)
console.info(this.formData.fileContent.length) })
}, //文件转base64
getBase64(file) {
return new Promise((resolve, reject) => {
let reader = new FileReader();
let fileResult = "";
reader.readAsDataURL(file); //开始转
reader.onload = function() {
fileResult = reader.result;
}; //转 失败
reader.onerror = function(error) {
reject(error);
}; //转 结束 咱就 resolve 出去
reader.onloadend = function() {
resolve(fileResult);
};
});
},
前端element ui 文件base64加密字符串 上传的更多相关文章
- 移动前端—H5实现图片先压缩再上传
在做移动端图片上传的时候,用户传的都是手机本地图片,而本地图片一般都相对比较大,拿iphone6来说,平时拍很多图片都是一两M的,如果直接这样上传,那图片就太大了,如果用户用的是移动流量,完全把图片上 ...
- 求大师点化,寻求大文件(最大20G左右)上传方案
之前仿造uploadify写了一个HTML5版的文件上传插件,没看过的朋友可以点此先看一下~得到了不少朋友的好评,我自己也用在了项目中,不论是用户头像上传,还是各种媒体文件的上传,以及各种个性的业务需 ...
- JS代码实用代码实例（输入框监听，点击显示点击其他地方消失,文件本地预览上传)
前段时间写前端,遇到一些模块非常有用,总结以备后用 一.input框字数监听 <!DOCTYPE html> <html lang="en"> <he ...
- SpringMVC上传压缩文件，解压文件，并检测上传文件中是否有index.html
SpringMVC上传压缩文件,解压文件,并检测上传文件中是否有index.html 说明: 1.环境:SpringMVC+Spring+Tomcat7+JDK1.7 2.支持 zip和rar格式的压 ...
- js上传文件带参数，并且，返回给前台文件路径，解析上传的xml文件，存储到数据库中
ajaxfileupload.js jQuery.extend({ createUploadIframe: function(id, uri) { //create frame var frameId ...
- Web.Config文件配置之限制上传文件大小和时间
在邮件发送系统或者其他一些传送文件的网站中,用户传送文件的大小是有限制的,因为这样不但可以节省服务器的空间,还可以提高传送文件的速度.下面介绍如何在Web.Config文件中配置限制上传文件大小与时间 ...
- [html5+java]文件异步读取及上传核心代码
html5+java 文件异步读取及上传关键代码段 功能: 1.多文件文件拖拽上传,file input 多文件选择 2.html5 File Api 异步FormData,blob上传,图片显示 3 ...
- 使用swfupload上传超过30M文件，使用FLASH上传组件
原文:使用swfupload上传超过30M文件,使用FLASH上传组件 前一段时间会员的上传组件改用FLASH的swfupload来上传,既能很友好的显示上传进度,又能完全满足大文件的上传. 后来服务 ...
- PHP之文件的锁定、上传与下载
小结文件的锁定机制.上传和下载 1.文件锁定 现在都在讲究什么分布式.并发等,实际上文件的操作也是并发的,在网络环境下,多个用户在同一时刻访问页面,对同一服务器上的同一文件进行着读取,如果,这个用户刚 ...
- ASP.NET MVC 使用Uploadify实现多文件异步无刷新上传
软件技术开发,合作请联系QQ:858-048-581 这里我通过使用uploadify组件来实现异步无刷新多文件上传功能. 1.首先下载组件包uploadify,我这里使用的版本是3.1 2.下载后解 ...
随机推荐
- 1、app自动化的底层逻辑，adb及monkey和稳定性测试
app自动化的过程中,底层逻辑是计算机通过adb与移动设备进行沟通,告诉移动设备,进行什么操作: 一.概念: Andriod调试桥(adb),是一种命令行工具,可以让我们与设备进行通讯. 二.adb安 ...
- golang 实现twitter雪花算法
1 /* 2 * twitter雪花算法golang实现,生成唯一趋势自增id 3 * 保留位:63位 4 * 毫秒时间戳:[62-20]43位,时间范围[1970-01-01 00:00:00.00 ...
- fsck.fat 检查修复(MS-DOS)fat类型文件系统
使用方式 fsck.fat [option] DEVICE 例如 fsck.fat -aw /dev/usba0 fsck.fat 检查fat文件系统的一致性,并选择性的尝试修复他们. 如下文件系统问 ...
- 网络-6 IPV6（上）
一.iPv4与ipv6对比 1.ipv4与ipv6优缺点 1.1 Ipv4与ipv6对比,ipv4中的切片使用的三个字段:identification flags fragment offse ...
- pytest设计项目结构
api目录封装所有的接口 testcases目录写所有的测试用例.conftest全局登录前置操作 data目录测试数据 common或者utils目录.存放公共模块比如读取yml文件.连接数据库.所 ...
- 提交from表单，method与浏览器请求显示不一致
<from method="post" action ="/login_check"> 用户名:<input type="text& ...
- 关于活动目录AD（域）的相关配置(已更新8.31)
关于活动目录AD(域)的相关配置 目录 一. 配置Server2019升级活动目录AD 1 二. 配置活动目录AD内的文件服务器 13 三. 配置活动目录AD域内分发软件 ...
- Java8函数式编程(A)
将行为作为数据传递 函数编程的最直接的表现,莫过于将函数作为数据自由传递,结合泛型推导能力,使代码表达能力获得飞一般的提升. Java8怎么支持函数式编程? 主要有三个核心概念: 函数接口(Funct ...
- C#中检测代码执行时间
使用System.Diagnostics.Stopwatch, using System; using System.Diagnostics; using System.Threading; clas ...
- ubuntu 16.04 安装peach
当前操作系统:ubuntu 16.04 使用 TUNA 的软件源镜像替换sources.list 备份原sources.list文件 sudo cp /etc/apt/sources.list /et ...