change事件触发条件是文件上传框内容改变才可以,每次上传完文件默认是不清空上一次上传的内容的,这样上传同名文件就不会触发change事件。

网上现有的方法就是重置input上传文件的标签的dom结构,在vue里我的实现方法就是v-if去控制。

v-if=”clearShow”,初始化数据为true,在change事件触发的函数里设置clearShow为false,即移除了该input标签,然后在回调函数中再设置clearShow为true,这时的文件上传框就是清空的了。再上传同名文件也不会受影响了。

 <input
          v-if="clearShow"
          class="upload_input"
          type="file"
          @change="upExecl"
          ref="upExecl"
          style="opacity: 0"
          accept=".doc,.pdf,.docx"
        />

<script>

 //上传公文
    upExecl(e) {
      this.clearShow = false;
      let self = this;
      self.fileId = "";
      let file = e.target.files[0];
      this.reportTemplateModel.title = file.name;
      this.param.file = file;
      this.titleName = file.name;
      upload({ file }).then((res) => {
        this.clearShow = true;
        let { data } = res.data;
        this.content = data;
        this.$refs.modelTxtQuill.quill.setText(data);
      });
    },
</script>

Logo

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐