Question

我需要向用户呈现vue-dropzone响应。我该怎么办？

文件上传良好，我只需要显示以通过警报框或消息通知用户它已上传。

<template>
    <div class="container">
        <div class="eight wide field">

                <vue-dropzone ref="myVueDropzone" id="dropzone" :options="dropzoneOptions" vdropzone-success=""></vue-dropzone>

        </div>
    </div>
</template>

<script>
    import vue2Dropzone from 'vue2-dropzone';
    import 'vue2-dropzone/dist/vue2Dropzone.min.css';

    export default {
      name: 'app',
      components: {
        vueDropzone: vue2Dropzone
      },
      data: function () {
        return {
          dropzoneOptions: {
              url: '/formsubmit',
              thumbnailWidth: 150,
              maxFilesize: 0.5,
              addRemoveLinks: true,
              removeFile:true,
              headers: { "X-CSRF-TOKEN": document.head.querySelector("[name=csrf-token]").content }
          }
        }
      }
    };

</script>

Answer 1

添加vdropzone成功

<vue-dropzone ref="myVueDropzone" id="dropzone" :options="dropzoneOptions" vdropzone-success="somesuccess"></vue-dropzone>

创建方法

method:{

somesuccess(file,response)
console.log(response);

}

Answer 2

您可以添加侦听器处理程序以侦听vdropzone-success组件的vue-dropzone事件。

此代码应该可以正常工作。

<vue-dropzone ref="myVueDropzone" id="dropzone" :options="dropzoneOptions" 
    v-on:vdropzone-success="uploadSuccess"></vue-dropzone>

methods: {
   uploadSuccess: function(file, response) {
      your_function(file, response);
   }
}

希望这对您有所帮助。

如何在浏览器上显示Vue-Dropzone响应？

2 个答案: