CODEWITHSUNDEEP
javascriptvue.js
FUN_
FUN_

Reputation: 5

Display several images with vuejs

I am new to Vue and i wonder if there is a way to upload and display several images at once

<input type="file" name="photo" accept="image/*" @change="onFileChange($event.target.files)" />
<div id="preview">
    <img v-if="url" :src="url" />data() {
    return {
        url: [],
    }
},
methods: {
    onFileChange(event) {
        const files = event.target.files;

        for(let i = 0; i < files.length; i++) {

            const file = files[i];
            this.url = URL.createObjectURL(file);
        }

    }
}

Upvotes: 0

Views: 882

Answers (1)

Igor
Igor

Reputation: 809

I think adding multiple attribute to input tag is what you're looking for:

<input type="file" multiple name="photo" accept="image/*" @change="onFileChange($event.target.files)" />

Upvotes: 1

Related Questions