elementplus 上传文件

参考文章

               <el-upload class="upload-img" action="":on-remove="handleRemove":before-upload="beforeUpload"list-type="picture":file-list="fileList"><el-button size="small" type="danger">点击上传</el-button></el-upload>//js部分//图片上传beforeUpload(file,id) {let fd = new FormData()fd.append('file', file)const obj = {name:'',file:''}dataSet.fileList = []axios.post('/api/common/upload', fd, {headers: {'Content-Type': 'multipart/form-data'}}).then(res=>{dataSet.addform.image = res.data.urlobj.name = file.name;obj.url = res.data.url;dataSet.fileList.push(obj)console.log(res);})},


//图片转64格式
//处理上传的图片getFile(file, fileList){console.log(file)methods.getBase64(file.raw).then(res => {// dataSet.imgObj.name = file.name;// dataSet.imgObj.file= res}).then(()=>{console.log(dataSet.imgObj);axios.post('/api/common/upload', file, {headers: {'Content-Type': 'multipart/form-data'}}).then(res=>{console.log(res);})// uploadImg(dataSet.imgObj).then(res=>{//     console.log(res);// })})},//图片转64getBase64(file) {return new Promise(function(resolve, reject) {let reader = new FileReader();let imgResult = "";reader.readAsDataURL(file);reader.onload = function() {imgResult = reader.result;};reader.onerror = function(error) {reject(error);};reader.onloadend = function() {resolve(imgResult);};});},

elementplus 上传文件相关推荐

Vue3中Element-Plus的el-upload清空上传文件（最简单明了）
核心技术: //取消上传,清空上传文件function doClear () {uploadrefss.value.clearFiles() } 汇总 <template> <div ...
vue3+ts+vite+elementPlus实现文件上传导入excle给后端，并且清空上传文件后的列表，以及formData变成[object FormData]的解决方法
一.文件上传 1.首先我们文件上传的方法用到的是multipart/form-data,它是基于post方法来传递数据的,需求是实现类似与这样的:来一个弹框实现两个excel的文件导入 2.用vue的 ...
关于前端上传文件到后台，文件大小超出限制，导致上传失败的解决办法。
文章出处:Jiangkuobo,微信:jkb_267460 文章目录前言一.使用elementPlus上传图片,出现的问题. 二.验证猜想 1.验证方式: 2.测试结果: 3.我的猜想与验证三. ...
el-upload上传文件
el-upload上传文件前言公司和学校项目都用到了上传文件的功能,记录一下. 准备 express实现的上传接口 const express = require('express'); // ...
smartupload 上传文件时把页面编码改成gbk 解决乱码
快来java1234 吧 smartupload 上传文件时,经常会发生因为把表单设置为 enctype="multipart/form-data"而出现的中文乱码问题,本人头疼好 ...
关于上传文件的跨域问题
在进行新框架开发的过程中,需要自定义页面组件实现脱离表单的文件(图片)上传,考虑过wex5自带的attachmentsimple的自定义写法很难受,就改用了第三方插件webuploader来实现选择文 ...
html web上传文件原理,Web上传文件的原理及实现
本文为原创,如需转载,请注明作者和出处,谢谢! 现在有很多Web程序都有上传功能,实现上传功能的组件或框架也很多,如基于java的Commons FileUpload.还有Struts1.x和Stru ...
php利用上传文件,如何利用PHP上传文件
上载文件表单请选择文件: $upload_file=$_FILES['upload_file']['tmp_name']; $upload_file_name=$_FILES['upload_fil ...
window linux上传文件命令,windows通过cmd命令行使用sftp上传文件至linux
一问:sftp是什么? sftp 是一个交互式文件传输程式.它类似于 ftp, 但它进行加密传输,比FTP有更高的安全性.下边就简单介绍一下如何远程连接主机,进行文件的上传和下载,以及一些相关操作. ...

elementplus 上传文件

elementplus 上传文件相关推荐

最新文章

热门文章