每当用户输入数据时，如何强制触发@change/@input 事件？

Question

我可以使用input DOM element上传图像并将其数据传递给 function，如下所示：

<input type="file" @change="myFunction"/>

但由于事件是@change ，它仅在图像数据更改时触发。 当我想两次上传同一张图片时，该事件不会触发。 我尝试使用@input事件，但它的行为完全相同，在上传相同的图像时不会触发。

有没有办法两次上传同一张图片？

Answer 1

您可以通过附加@click事件然后清空目标值event.currentTarget.value = ''实现

现场演示：

 new Vue({ el: '#app', methods: { myClickFunction(e) { e.currentTarget.value = ''; }, myFunction() { console.log('call'); } } })

 <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> <div id="app"> <input type="file" @click="myClickFunction" @change="myFunction"/> </div>