Element UI Upload 上传文件只能上传一次 ,再次点击上传后无反应的问题

2022年7月8日10:15:19
Element UI Upload 上传文件上传文件一次 ,不论是上传成功之后修改文件再上传还是上传失败重新上传,再次点击上传均无反应。

方法一:利用 :on-success

ref=‘upload’
:on-success=“handleSuccess”

注意:ref='upload 一定要加上ref 不然不起作用

                <el-upload
                        class="upload-demo"
                        action=""
                        :limit="1"
                        :show-file-list="false"
                        :http-request="uploadLogo"
                        ref='upload'
                        :on-success="handleSuccess"
                >
                    <el-button style="width: 150px; height: 35px;line-height: 0;margin-left: 20px" size="medium"
                               type="primary">
                        {{$t('StaffManage.bulkImport')}}
                    </el-button>
                </el-upload>
        handleSuccess(res, file) {
            this.$refs.upload.clearFiles(); //上传成功之后清除历史记录
            // this.tableReload()
        },

方法二:利用if el-upload让移除文档流

<el-upload
                        v-if="!form.contractFileUrl"class="upload-demo"action=""
                        :limit="1"
                        :show-file-list="false"
                        :http-request="uploadLogo"><el-buttonsize="medium"type="primary">{{$t('AttendanceInformation.ClickUpload')}}</el-button></el-upload>
            uploadLogo(param){let _this= this
                _this.form.contractFileUrl='1'let formData= new FormData();
                formData.append("file", param.file);
                _this.$send.post({url:'/contract/upload', data: formData}, res=>{if(res.code===10000){
                        _this.isdisabled=true
                        _this.form.contractFileUrl= res.data.url
                        _this.form.contractFileId= res.data.id}else{
                        _this.form.contractFileUrl= null
                        _this.form.contractFileId= null
                        _this.$msg.error(res.message)}})},
  • 作者:程序员里的BUG
  • 原文链接:https://blog.csdn.net/m0_48259951/article/details/122556430
    更新时间:2022年7月8日10:15:19 ,共 1189 字。