如何在上传文件后为文件对象添加新的属性

Dropzone.js - How to add new property to file object after uploading file

本文关键字:文件 对象 添加 属性      更新时间:2023-09-26

我使用dropzone和PHP来上传和删除文件。当我加载我的上传页面,我创建了一些mockfiles与以下参数:名称,大小,缩略图和id。这个模拟是使用预先上传的数据设置的。

当有人点击删除文件按钮时,我调用php方法来删除图像

我的问题是当用户上传文件并试图删除它而不加载页面。当它发生时,dropzone文件对象不能被修改。

我在:

var dropZone3 = new Dropzone("#file3",{
                    init: function() {
                        this.on('success', function (file) {
                            console.log(file);
                            file['test'] = 'test';
                            file.test = 'test';
                            console.log(file);
                        })
                    },
                    paramName: 'file3',
                    autoProcessQueue:true,
                    uploadMultiple: false,
                    parallelUploads: 1,
                    maxFiles: 3,
                    maxFilesize: 5,
                    addRemoveLinks: true

我的问题是第一个console.log和第二个在init on success函数中显示相同的文件。

有人知道怎么修理它吗?

提前感谢。

可以直接添加属性到file对象(dropzone v4.3.0)

var dropZone = new Dropzone(document.querySelector('.js-dropzone'), {
  url: '/file/upload'
});
dropZone.on('success', function (file, response) {
  var res = JSON.parse(response);
  if (res.result == true) {
    file.test = 'test';
    file.id = res.id;
  }
});       

不要认为你可以在已经上传的文件对象上添加属性,但你可以在accept属性上添加它:

var dropZone3 = new Dropzone("#file3", {
    url: "upload.php",
    init: function () {
        this.on('success', function (file) {
            console.log(file);
        })
    },
    accept: function(file, done) {
        file.test = "test";
        return done();
    },
    paramName: 'file3',
    autoProcessQueue: true,
    uploadMultiple: false,
    parallelUploads: 1,
    maxFiles: 3,
    maxFilesize: 5,
    addRemoveLinks: true
});