Question

我正在使用react dropzone组件https://github.com/felixrieseberg/React-Dropzone-Component来帮助将文件拖放到网站上。

我希望每个丢弃到dropzone的文件都会发布到不同的URL（AWS预签名URL）。基本上我希望组件配置参数'postUrl'在此预签名URL更改时动态更改。

我目前有以下组件配置集

class Uploader extends React.Component {
  constructor(props){
   super(props);
   this.dropzone = 'null'
  }

  config = () => (
    {
      iconFiletypes: ['.jpg', '.png', '.gif'],
      showFiletypeIcon: true,
      postUrl: this.dropzone.options.url || 'no-url'
    }
  );

  eventHandlers = () => (
    {
      processing: function(file) {
      },
      init: dz => this.dropzone = dz,
    }
  );

  djsConfig = (requestID=this.props.requestId) => (
    {
      addRemoveLinks: false,
      acceptedFiles: "image/jpeg,image/png,image/gif",
      autoProcessQueue: true,
      init: function () {
        this.on("processing", async (file) => {
          const presigned_url = await uploadUrl(file, requestID, () => {})
          this.options.url = presigned_url;
        });
      }
    }
  );
}

加载页面/组件时出现以下错误：

Uncaught TypeError: Cannot read property 'url' of undefined

在处理文件时，通过options.url更新Dropzone对象上的djsConfig无法按照我的意愿更新postUrl: this.dropzone.options.url吗？

Answer 1

如lex所评论。更改您的初始化方法，如下所示：

     init:function () {
         var _this=this;
         this.on("processing", async (file) => {
            const presigned_url = await uploadUrl(file, requestID, () => {})
           _this.options.url = presigned_url;
        });
     }

React Dropzone组件 - 如何动态更改postUrl？

1 个答案: