Vue.js 在vue中使用dropzone.js，使用图像文件名调用函数

我很难以我需要的方式使用它，但是我的Vue项目中有一个正在工作的dropzone实例

我可以上传dropzone代码中的图像和调用函数，但是，为了发送“card”对象，我需要直接从html中的表单调用函数

我所需要做的就是在通过dropzone表单添加文件时调用一个函数，其中包含文件名

我的代码：

    <div class="uk-width-3-10">
                    <form v-on:change="imageChange(card)" method="post" action="{{url('product/parts/upload/store')}}" enctype="multipart/form-data"
                          class="dropzone" v-bind:id="'dropzone-'+i">
                    </form>
                </div>

... 

    imageChange(Card){
        console.log('working');
    },
    addCard(){
      Vue.nextTick(function () {
              new Dropzone("#dropzone-"+cardIndex, {
                maxFilesize: 12,
                renameFile: function (file) {
                    var dt = new Date();
                    var time = dt.getTime();
                    return time + file.name;
                },
                acceptedFiles: ".jpeg,.jpg,.png,.gif",
                addRemoveLinks: true,
                timeout: 50000,
                removedfile: function (file) {
                    console.log(file.upload.filename);
                    var name = file.upload.filename;

                    var fileRef;
                    return (fileRef = file.previewElement) != null ?
                        fileRef.parentNode.removeChild(file.previewElement) : void 0;

                },
                init: function() {
                    this.on("addedfile", 
                    function(file) { 
                        instance.imageZoneNames.push({name: file.upload.filename});
                        console.log(file);
                        console.log(instance.imageZoneNames);
                    });
                }
            });
            });
         }

... 
图像更改（卡）{
console.log（'working'）；
},
addCard（）{
Vue.nextTick（函数（）{
新Dropzone（“Dropzone-”+cardIndex{
最大文件大小：12，
重命名文件：函数（文件）{
var dt=新日期（）；
var time=dt.getTime（）；
返回时间+file.name；
},
接受的文件：“.jpeg、.jpg、.png、.gif”，
addRemoveLinks：是的，
超时：50000，
removedfile:函数（文件）{
log（file.upload.filename）；
var name=file.upload.filename；
var fileRef；
return（fileRef=file.previewElement）！=null？
fileRef.parentNode.removeChild（file.previewElement）：无效0；
},
init:function（）{
此.on（“addedfile”，
函数（文件）{
instance.imageZoneNames.push（{name:file.upload.filename}）；
console.log（文件）；
log（instance.imageZoneNames）；
});
}
});
});
}

Dropzone有很多，您使用了

removedfile（）

事件！还有另一个名为

addedfile（）

的事件，在将文件添加到dropzone列表时执行

imageChange(card) {
 console.log(card)
},

addCard() {
 Vue.nextTick(() => {
  new Dropzone('#dropzone-` + cardIndex, {

   addedfile(file) {
    this.imageChange(file);
   }

  }
 }
}

Dropzone有很多，您使用了

removedfile（）

event！还有另一个名为

addedfile（）

的事件，在将文件添加到dropzone列表时执行

imageChange(card) {
 console.log(card)
},

addCard() {
 Vue.nextTick(() => {
  new Dropzone('#dropzone-` + cardIndex, {

   addedfile(file) {
    this.imageChange(file);
   }

  }
 }
}

---

是的，但是我需要知道如何使用我的card对象从表单调用自定义函数。我创建的dropzone实例中没有这些信息，所以使用addedfile不起作用。我只需要用文件名从html表单调用一个自定义函数，我不知道您到底想做什么！但我认为当添加文件时，您希望执行

imageChange（）

，对吗？如果正确，您仍然可以使用

addedfile（）

并将文件传递给自定义函数。我会为你编辑答案，如果不是你告诉我的，我很抱歉，我想我们最初都误解了，但是的，这正是我想要的，谢谢！是的，但是我需要知道如何使用我的card对象从表单调用自定义函数。我创建的dropzone实例中没有这些信息，所以使用addedfile不起作用。我只需要用文件名从html表单调用一个自定义函数，我不知道您到底想做什么！但我认为当添加文件时，您希望执行

imageChange（）

，对吗？如果正确，您仍然可以使用

addedfile（）

并将文件传递给自定义函数。我会为你编辑答案，如果不是你告诉我的，我很抱歉，我想我们最初都误解了，但是的，这正是我想要的，谢谢！