本文共 1181 字，大约阅读时间需要 3 分钟。

效果

删除按钮是我自己做的

下面上源代码（如果不理解，请在下面提出问题）

html(采用了element组件)

   
                 上传图片： 
   
       
   
             
    
                 
                      
     
      ×
     
                  
    
                
    
                     
                          
                     
    
  
   
                    
   
                                            
    
     保存
                                
   

js

data(){	preImg:'', //存放预览的图片	postData:{		img:'',.},//存放提交的图片} // ---测试上传图片        onPickFile2() {            this.$refs.fileInput.click();        },        getFile2: function(e) {            // console.log("e是什么",e)            let $target = e.target || e.srcElement;            let file = $target.files[0];            // 上传的图片            this.postData.img = file;   //存放提交图片            var reader = new FileReader();            reader.readAsDataURL(file);            reader.onload = data => {                let res = data.target || data.srcElement;                //   预览的图片                this.preImg = res.result;            };            // document.getElementById("upimg").value = "";  //这是能否上传同一张图片的关键            console.log("gaidongchenggong");        },        // ---↑

转载地址：http://lwzmf.baihongyu.com/