[Vuejs]-VueJS file upload not accepting file

by

0👍

I suggest you debugging points. Try and let me know.

data: function() { return {
        uploadPreview : "ABCD",
        }
    },
    methods : {
        onChange(e) {
            if (! e.target.files.length) return;

            let file = e.target.files[0];

            let reader = new FileReader();

            reader.readAsDataURL(file);
            reader.onload = e => {
        console.log("FIRST SEE WHAT'S INSIDE THE RESULTS",e.target.result);
        console.log("SECOND MAKE SURE YOU CAN ACCESS",this.uploadPreview) // this should print ABCD
                this.uploadPreview = e.target.result; // if this line is commented out or just not present, the upload will work but the preview won't show since uploadPreview does not have a value set.
                };
            },
     }

and finally 

<img width='200' :src="uploadPreview" :alt='uploadPreview' />

(alt should equals to image data)

👤margherita pizza

Leave a comment