javascript - 使用 redux 形式的 dropzone-react-component

Question

我正在使用 react 来设计一个简单的网页，该网页使用dropzone-react-component上传多个图像，并使用 reducer-dispatcher 模式（REDUX）提交到服务器。

坚持如何将我的文件 blob 或在 dropzone 中排队的文件数组传递给减速器。

请找到参考代码：

1. 反应组件类

   class ImageUploadClass extends Component {
   constructor(props){
     super(props);
   this.djsConfig = {
         addRemoveLinks: true,
         acceptedFiles: "image/jpeg,image/png,image/gif,application/pdf",
         autoProcessQueue: false
     };
     this.componentConfig = {
         iconFiletypes: ['.jpg', '.png', '.gif','.pdf'],
         showFiletypeIcon: true,
         postUrl: 'no-url'
     };
     this.dropzone = null;
   }
   
      handleFileAdded(file) {
          console.log(file);
        }
   
      handlePost() {
       console.log('Final Array'+this.dropzone.getQueuedFiles());
      }
   
     render() {
       const {handleSubmit, pristine, reset, submitting} = this.props;
       const config = this.componentConfig;
       const djsConfig = this.djsConfig;
       const eventHandlers = {
           init: dz => this.dropzone = dz,
           addedfile: this.handleFileAdded.bind(this)
       }
       return (
         <form onSubmit={handleSubmit(imagesSubmit)}>
           <div style={{'cursor':'pointer'}}>
           <DropzoneComponent config={config} eventHandlers={eventHandlers} djsConfig={djsConfig} />
           </div> 
           <button  className="next action-button" ref={submit => this.submit = submit} type="submit" disabled={submitting} onClick={this.handlePost.bind(this)}>Submit</button>
         </form>
       );
     }
   }
   ImageUploadClass = reduxForm({
     form: 'ImageUploadClass'
   })(ImageUploadClass);
   
   export default ImageUploadClass;
   

注意：为表单提交定义的常量函数

const imagesSubmit = (values,dispatch) =>{
     this.dropzone.getQueuedFiles();
      return dispatch(submitFunctionToDispatcher(values));
    }

请求已到达调度程序，但未检索到图像文件。我是否需要为其他 redux 字段定义相同的组件？

或者如果有人可以建议我将文件直接上传到 S3？

任何帮助，将不胜感激！