elementui二次文件上传要刷新

2021-02-06 06:17

阅读:557

标签:设置   sage   div   ora   数据   button   demo   loading   二次   

elementui 第二次或者第N次文件上传 要刷新页面才可以

原因:

因为你的 el-upload 设置了 :limit="1" 当你上传了一次文件后,你没有清楚当前的 files ,所有点击第二次没有反应

 

解决办法:

  1. 为你的 el-upload 添加
    ref="upload"

     

  2. 文件上传成功时的钩子中把files清空
    // 上传成功之后清除历史记录;否则只能上传一次
    this.$refs.upload.clearFiles()

     

 

完整页面代码:

template:
upload class="upload-demo" style="display: inline-block" ref="upload" accept=".xls,.xlsx" :action="uploadActionUrl" :data="upLoadData" :before-upload="handleBeforeUpload" :on-success="handleSuccess" :on-error="handleError" :limit="1" :show-file-list="false" enctype="multipart/form-data"> class="item" effect="dark" content="请下载模板再上传,且只能上传xls/xlsx文件" placement="top"> "info" icon="el-icon-upload2">导入教师信息
methods: // 导入教师信息 handleBeforeUpload () { // 上传文件之前的钩子 this.dataListLoading = true }, handleSuccess (res, file) { // 文件上传成功时的钩子 this.dataListLoading = false // 回调 if (res && res.code === 0) { this.$message({ message: 数据导入成功!, type: success, duration: 1500, onClose: () => { // 提示完渲染页面 this.getDataList() } }) } else if (res.code === 444) { // 当有教师信息重复导入时 this.errorDataVisible = true this.$nextTick(() => { this.$refs.errorData.init(res.errorData) }) } else { this.$message.error(res.msg) } // 上传成功之后清除历史记录;否则只能上传一次 this.$refs.upload.clearFiles() }, handleError () { // 文件上传失败时的钩子 this.dataListLoading = false this.$message({ message: 数据导入失败!, type: error, duration: 1500 }) },

 

elementui二次文件上传要刷新

标签:设置   sage   div   ora   数据   button   demo   loading   二次   

原文地址:https://www.cnblogs.com/HuangJie-sol/p/13118165.html


评论


亲,登录后才可以留言!