Dropzone + Vue Cannot access the dataURL

Question

Is it possible using dropzone upload file but do not ajax to url. But i can received the file object in Vue? I cannot access the dataURL

dropzoneOptions: {
    url: "/api/uploadImg",
    thumbnailWidth: 150,
    addRemoveLinks: true,
    autoDiscover: false,
    // autoProcessQueue: false,
    maxFiles: 1,
    headers: { "My-Awesome-Header": "header value" },
    init: function () {
        this.on("addedfile", function (file) {
            console.log(file.dataURL);
            this.pwraImg = file.dataURL;

            //     var reader = new FileReader();
            //     reader.readAsDataURL(file);
            //     reader.onload = () => {
            //         this.pwraImg = reader.result;
            //     };
        });
    },
}

Answer 1

Had the same problem, probably you already figured out but here's the answer for anyone else: "undefined" returned when accessing some listed properties of File object

Basically, the prop is async and you're probably trying to get it before it's ready.