前端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); }; }); },
标签:文件,fileContent,formData,base64,element,length,ui,file,reader 来源: https://www.cnblogs.com/szc1998/p/15508818.html