zoukankan      html  css  js  c++  java
  • element upload 上传报错 Uncaught TypeError: Cannot set property 'status' of undefined

    报错原因:设置了:file-list="fileList",filelist为只读,修改后就会报错 Cannot set property 'status' of undefined
    解决方法:在成功回调中用setTimeout清空上传列表即可解决。
    代码如下

     <el-upload  style="margin:10px 0 0 0;90%"  class="upload-demo" ref="upload" :on-success="success" :action='url"' :data="icon" :auto-upload="false" accept=".jpg, .png, .jpeg" :headers="headers" :on-change="onchangeupload" :on-remove="onremove" :file-list="fileList">
                <el-button slot="trigger" size="small" type="primary">{{$t('message.SelectFile')}}</el-button>
            </el-upload>
    
    //成功回调
    uploadsuccess (res) {
          if (res.code == "200") {
            this.$message({
              showClose: true,
              message: res.message,
              type: "success"
            })
    //-----------------------------------
    //解决关键代码:使用延时器清空上传文件列表和自定义参数,
          setTimeout(()=>{
            this.uploadfile=false
            this.icon={}
            this.$refs.upload.clearFiles()
          },100)
    //------------------------------------
          } else {
            this.$message({
              showClose: true,
              message: res.message,
              type: "error"
            })
          }
    
        },
    //失败回调
        uploaderror (res) {
          this.$message({
            showClose: true,
            message: res.message,
            type: "error"
          })
        },
    //打开弹框
          showUploadLogShow(val){
            this.uploadLog=true
            this.isUpload=val.isUpload
            this.fileTypeobj={
              fileType:"licenseFile",
              fileId:val.fileId,
              id:val.id
            }
          },
    //删除文件回调
     onremove(val,list){
            if(list.length==0){
              this.uploadfile=false
            }else{
              this.uploadfile=true
            }
          },
          onchangeupload(val,list){
            this.fileList = list.slice(-1);//只上传一个文件,自动更换最新选择文件
            if(list.length==0){
              this.uploadfile=false
            }else{
              this.uploadfile=true
            }
          },
    //触发上传
          trueload() { 
            if(this.uploadfile){
               if(this.isUpload){ 
               this.$confirm(this.$t('message.xukewenjaincunzai'),this.$t('message.Tips'), {
                    confirmButtonText:this.$t('message.Ok'),
                    cancelButtonText: this.$t('message.Cancel'),
                    type: 'warning'
                  }).then(() => {
                      this.$refs.upload.submit()
                        this.uploadLog = false
                        this.getData()
                }).catch(()=>{
                      this.$message({
                        showClose: true,
                        message:this.$t('message.Cancelupload'),
                      })
                      this.uploadLog = false
                    })
                }else{
                  this.$refs.upload.submit()
                  this.uploadLog = false
                  this.getData()
              }
            }else{
              this.$message({
                  showClose: true,
                  message:this.$t('message.Pleaseselectuploadfile'),
                  type: "error"
                })
            }
          },
    
    
    
    
  • 相关阅读:
    进程(第三部分)
    02_jni_hello_c函数介绍
    01_ndk目录介绍
    00_前情回顾
    06_锅炉压力案例_progressbar实现
    05_锅炉压力案例_java实现
    ASP.NET MVC的过滤器笔记
    ASP.NET MVC的过滤器笔记
    ASP.NET MVC的过滤器笔记
    ASP.NET MVC的过滤器笔记
  • 原文地址:https://www.cnblogs.com/FormerWhite/p/12486411.html
Copyright © 2011-2022 走看看