前端element ui 文件base64加密字符串 上传
2024-10-20 03:38:13
<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);
};
});
},
最新文章
- 排序算法----基数排序(RadixSort(L,max))单链表版本
- poj 1737男人八题之一 orz ltc
- J2EE web项目中解决所有路径问题
- Linux 命令与文件的搜寻
- javaScript入门第一天
- GridFS图片
- xml追加节点
- 虚拟化之vmx配置文件
- IHttpModule接口
- 初次接触GWT,知识点总括
- 在Linux终端执行clear或top命令时出现:&#39;xterm&#39;: unknown terminal type
- 畅谈Spring设计哲学
- Xcode HeaderDoc 过程(1)
- 每R一点:层次聚类分析实例实战-dist、hclust、heatmap等(转)
- Java版 QQ空间自动登录无需拷贝cookie一天抓取30WQQ说说数据&;流程分析
- Java跨域问题的处理详解
- C中指针符*和取址符&;
- Windows下SVN备份脚本
- LLDP协议、STP协议 笔记
- ros 使用命令测试topic