input多次选中同一上传文件不会触发change事件问题

问题描述

1、input标签类型为file时,多次选取同一个文件没有触发change(onchange)事件。前后选取不同文件,则可以正常触发change(onchange)事件。
2、vue项目中使用了v-if判断,桌面端程序有效,web端无效

  <input
    v-if="clearFileShow"
    ref="uploadFileRef"
    multiple
    type="file"
    accept="application/pdf"
    style="display: none"
    @change="uploadFilesAction"
  />

解决方案:

input标签的value在多次选取同一个文件时没有任何变化,根据这个提示测试改变value,发现有效。
js直接修改change方法中的target值;vue项目中还可以根据ref修改值。

uploadFilesAction(event){
     // js
    event.target.value = '';
    //或者:
    event.target.value = null;
    // vue3
   uploadFileRef.value.value = '';
    //或者:
    uploadFileRef.value.value = null;
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容