好资源导航 » 文章资讯 » vue+elementUI实现图片上传功能

vue+elementUI实现图片上传功能

2023-08-16 23:17:04 58

本文实例为大家分享了vue+elementUI图片上传的具体代码，供大家参考，具体内容如下

1、html

2、定义

http://www.haoziyuan.ccdialogImageUrl:'',
imgDialogVisible:false,
fileLists:[],

3、在需要使用的方法中给fileLists[]赋值

vm.fileLists=[];
if(row.logo!=undefined&&row.logo!=""){
vm.fileLists.push({url:row.logo});
}

4、其他几个属性的方法

//删除图片
handleRemove(file,fileList){
this.form.logo=''
},
//查看大图
handlePictureCardPreview(file){
this.http://www.haoziyuan.ccdialogImageUrl=file.url;
this.imgDialogVisible=true;
},
//图片上传成功
success(response,file,fileList){
this.fileLists=[];
this.fileLists=[file]
this.form.logo=file.response.result;
},

5、图片上传的位置和路径是存在不同的表中。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

返回顶部
514930285
czq8825@qq.com

vue+elementUI实现图片上传功能

热门推荐

随机推荐