I am currently working on implementing an upload feature in my web application using vue 2. Here is a snippet of the code:
<label class="btn btn-xs btn-primary">
<input type="file" name="attachment[]" @change="onFileChange" multiple/>
Upload file
</label>
input[type="file"] {
display: none;
}
onFileChange() {
this.reaction.attachment = event.target.files || event.dataTransfer.files;
}
Now, I want to display the file names that are included in the event.target.files object.
I have attempted the following:
<p v-for="file in reaction.attachment">
{{ file.name }}
</p>
However, this does not seem to be working as expected. Looking into my Vue devtools, the attachment object appears like this:
attachment: FileList
Any ideas on how to make this work?
Thank you!