Question

我正在将Dropzone.js与Vuejs2一起使用。文件上传工作正常，但是在success回调函数中，我无法将响应分配给父对象。

以下是我的实现示例：

<script>
    import vueDropzone from "vue2-dropzone";

      export default {
        components: {
          vueDropzone
        },
        props: {
        },
        data: () => ({
            data: {
              name: ''
            },
            dropOptions: {
                url: "https://httpbin.org/post",
                maxFileSize: 10,
                autoProcessQueue: false,
                success: (file, response) => {
                if (response.message == "success"){
                  this.data.name = response.name;                
                  this.add();
                }
                else{
                  console.log('Error Uploading file');
                }
           }
       }),
     };
</script>

错误是：

未捕获的TypeError：无法设置未定义的属性“名称”

我尝试了找到Here的解决方案，但仍然无法正常工作。

Answer 1

这根本行不通，因为this绑定到了您想不到的另一个对象上。这是人们切换或学习JavaScript时的一些默认错误。

dropOptions是一个对象。 this函数中的success是指dropOptions对象，而不是其父对象。

因此dropOptions没有字段data，因此是undefined，您无法访问name。

请参阅：access parent object in javascript

编辑：为了进一步调查，请提供一些关于您发布的链接所做的代码。这似乎是朝着正确的方向发展，但从简单的“不起作用”来看，我们无法告诉您还需要记住什么。

Answer 2

看着documentation，您使用的是错误的。

public function __construct() { $this->middleware('auth:superAdmin'); } public function index() { return view('BackEnd.home'); }仅应包含configuration，而不包含事件。

对于您的情况dropOptions，您需要使用vue-2-dropzones events，所以：

vdropzone-success(file, response)

这个。在dropzone成功回调vuejs2内部未定义

2 个答案: