feat: add beforeMultipleUpload api

README.md

@@ -70,7 +70,8 @@ React.render(<Upload />, container);
 |onError| function| | error callback |
 |onSuccess | function | | success callback |
 |onProgress | function || progress callback, only for modern browsers|
-|beforeUpload| function |null| before upload check, return false or a rejected Promise will stop upload, only for modern browsers|
+|beforeUpload| function(file,fileList) |null| before upload check, if multiple is true, each file will be triggered once, return false or a rejected Promise will stop upload, only for modern browsers |
+|beforeMultipleUpload | function(fileList) |null| before upload check, different from beforeUpload, it will only trigger once, return false or a rejected Promise will stop upload, only for modern browsers |
 |customRequest | function | null | provide an override for the default xhr behavior for additional customization|
 |withCredentials | boolean | false | ajax upload with cookie send |
 |openFileDialogOnClick | boolean | true | useful for drag only upload as it does not trigger on enter key or click event |

examples/beforeMultipleUpload.html

@@ -0,0 +1 @@
+placeholder

examples/beforeMultipleUpload.js

@@ -0,0 +1,45 @@
+/* eslint no-console:0 */
+
+import React from 'react';
+import ReactDOM from 'react-dom';
+import Upload from 'rc-upload';
+
+const props = {
+  action: '/upload.do',
+  multiple: true,
+  onStart(file) {
+    console.log('onStart', file, file.name);
+  },
+  onSuccess(ret) {
+    console.log('onSuccess', ret);
+  },
+  onError(err) {
+    console.log('onError', err);
+  },
+  beforeMultipleUpload(fileList) {
+    console.log(fileList);
+    return new Promise((resolve) => {
+      console.log('start check');
+      setTimeout(() => {
+        console.log('check finshed');
+        resolve(fileList);
+      }, 3000);
+    });
+  },
+};
+
+const Test = () => {
+  return (
+    <div
+      style={{
+        margin: 100,
+      }}
+    >
+      <div>
+        <Upload {...props}><a>开始上传</a></Upload>
+      </div>
+    </div>
+  );
+};
+
+ReactDOM.render(<Test/>, document.getElementById('__react-content'));

src/AjaxUploader.jsx

@@ -1,4 +1,5 @@
 /* eslint react/no-is-mounted:0,react/sort-comp:0,react/prop-types:0 */
+/* eslint no-shadow: 0 */
 import React, { Component } from 'react';
 import classNames from 'classnames';
 import defaultRequest from './request';
@@ -86,36 +87,68 @@ class AjaxUploader extends Component {
   }
 
   uploadFiles = (files) => {
+    const { props } = this;
     const postFiles = Array.prototype.slice.call(files);
-    postFiles
-      .map(file => {
-        file.uid = getUid();
-        return file;
-      })
-      .forEach(file => {
+    postFiles.forEach((file) => {
+      file.uid = getUid();
+    });
+    if (props.beforeMultipleUpload) {
+      this.upload(null, postFiles);
+    } else {
+      postFiles.forEach((file) => {
         this.upload(file, postFiles);
       });
+    }
   };
 
   upload(file, fileList) {
     const { props } = this;
-    if (!props.beforeUpload) {
+    if (props.beforeMultipleUpload) {
+      const beforeMultiple = props.beforeMultipleUpload(fileList);
+      if (beforeMultiple && beforeMultiple.then) {
+        beforeMultiple
+          .then((processedFiles) => {
+            const isProcessedFilesTypeCorrect = processedFiles.every((processedFile) => {
+              const processedFileType = Object.prototype.toString.call(processedFile);
+              return processedFileType === '[object File]' || processedFileType === '[object Blob]';
+            });
+            if (isProcessedFilesTypeCorrect) {
+              processedFiles.forEach((processedFile) => {
+                this.post(processedFile);
+              });
+            } else {
+              fileList.forEach((file) => {
+                this.post(file);
+              });
+            }
+          })
+          .catch((e) => {
+            console && console.log(e); // eslint-disable-line
+          });
+      } else if (beforeMultiple !== false) {
+        fileList.forEach((file) => {
+          setTimeout(() => this.post(file), 0);
+        });
+      }
+    } else if (props.beforeUpload) {
+      const before = props.beforeUpload(file, fileList);
+      if (before && before.then) {
+        before
+          .then((processedFile) => {
+            const processedFileType = Object.prototype.toString.call(processedFile);
+            if (processedFileType === '[object File]' || processedFileType === '[object Blob]') {
+              return this.post(processedFile);
+            }
+            return this.post(file);
+          })
+          .catch((e) => {
+            console && console.log(e); // eslint-disable-line
+          });
+      } else if (before !== false) {
+        setTimeout(() => this.post(file), 0);
+      }
+    } else {
       // always async in case use react state to keep fileList
-      return setTimeout(() => this.post(file), 0);
-    }
-
-    const before = props.beforeUpload(file, fileList);
-    if (before && before.then) {
-      before.then((processedFile) => {
-        const processedFileType = Object.prototype.toString.call(processedFile);
-        if (processedFileType === '[object File]' || processedFileType === '[object Blob]') {
-          return this.post(processedFile);
-        }
-        return this.post(file);
-      }).catch(e => {
-        console && console.log(e); // eslint-disable-line
-      });
-    } else if (before !== false) {
       setTimeout(() => this.post(file), 0);
     }
   }

src/Upload.jsx

@@ -19,6 +19,7 @@ class Upload extends Component {
     onSuccess: empty,
     multiple: false,
     beforeUpload: null,
+    beforeMultipleUpload: null,
     customRequest: null,
     withCredentials: false,
     openFileDialogOnClick: true,