fix: 图片上传超过9张问题 (#43)

lib/components/Editor/index.js

@@ -163,7 +163,11 @@ var Editor = function (_React$Component) {
   }, {
     key: "handleChangeFileList",
     value: function handleChangeFileList(fileList) {
-      this.setState({ fileList: fileList });
+      var list = fileList;
+      if (fileList.length > this.props.maxUpload) {
+        list = fileList.slice(0, this.props.maxUpload);
+      }
+      this.setState({ fileList: list });
     }
 
     /**

lib/index.js

@@ -70,7 +70,7 @@ if (process.env.NODE_ENV !== "production") {
     },
     editorProps: {
       // emojiPopoverPlacement: "bottom",
-      uploadPopoverPlacement: "top"
+      // uploadPopoverPlacement: "top"
     }
   });
 }

lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.js"],"names":["Index","props","editorProps","renderComment","config","id","Error","type","businessId","console","warn","API","ReactDOM","render","document","getElementById","window","process","env","NODE_ENV","businessUserId","userId","onCountChange","log","c","uploadPopoverPlacement"],"mappings":";;;;AAAA;;;;AACA;;;;AACA;;;;;;AACA;;AAEA,IAAMA,QAAQ,SAARA,KAAQ;AAAA,SACZ;AAAC,iBAAD;AAAA,eAAK,sBAAL,EAAsB,oBAAtB,EAAqC,oBAArC,EAAoD,eAApD,IAAkEC,KAAlE;AACE,kCAAC,WAAD,aAAQ,WAAW,CAAnB,EAAsB,eAAtB,IAAoCA,MAAMC,WAA1C;AADF,GADY;AAAA,CAAd;;AAMA;;;;;;;;AAQA,SAASC,aAAT,CAAuBC,MAAvB,EAA+B;AAC7B,MAAI,CAACA,OAAOC,EAAZ,EAAgB;AACd,UAAM,IAAIC,KAAJ,CAAU,gBAAV,CAAN;AACD;AACD,MAAI,CAACF,OAAOG,IAAZ,EAAkB;AAChB,UAAM,IAAID,KAAJ,CAAU,kBAAV,CAAN;AACD;AACD,MAAI,CAACF,OAAOI,UAAZ,EAAwB;AACtB;AACAJ,WAAOI,UAAP,GAAoB,MAApB;AACAC,YAAQC,IAAR,CAAa,+BAAb;AACD;AACD,MAAI,CAACN,OAAOO,GAAZ,EAAiB;AACf;AACAP,WAAOO,GAAP,GAAa,oCAAb;AACAF,YAAQC,IAAR,CACE,sDADF;AAGD;;AAEDE,qBAASC,MAAT,CAAgB,8BAAC,KAAD,EAAWT,MAAX,CAAhB,EAAuCU,SAASC,cAAT,CAAwBX,OAAOC,EAA/B,CAAvC;AACA;AACD;;AAEDW,OAAOb,aAAP,GAAuBA,aAAvB;;AAEA,IAAIc,QAAQC,GAAR,CAAYC,QAAZ,KAAyB,YAA7B,EAA2C;AACzChB,gBAAc;AACZE,QAAI,cADQ;AAEZE,UAAM,CAFM;AAGZC,gBAAY,MAHA;AAIZY,oBAAgB,CAJJ;AAKZC,YAAQ,KALI;AAMZC,mBAAe,0BAAK;AAClBb,cAAQc,GAAR,CAAYC,CAAZ;AACD,KARW;AASZtB,iBAAa;AACX;AACAuB,8BAAwB;AAFb;AATD,GAAd;AAcD;;AAED;AACA;AACA;AACA;AACA;AACA","file":"index.js","sourcesContent":["import React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport App, { Editor } from \"./App\";\n// import registerServiceWorker from \"./registerServiceWorker\";\n\nconst Index = props => (\n  <App showAlertComment showAlertReply showAlertFavor showError {...props}>\n    <Editor maxUpload={9} autoFocus {...props.editorProps} />\n  </App>\n);\n\n/**\n * 渲染评论组件\n * @param {object} config 编辑器配置\n *  - {string} id 渲染评论的DOM的 ID\n *  - {number} type 评论的 type\n *  - {string} businessId 评论的 businessId\n *  - {string} API, API 前缀, 默认 http://api.links123.net/comment/v1\n */\nfunction renderComment(config) {\n  if (!config.id) {\n    throw new Error(\"id is required\");\n  }\n  if (!config.type) {\n    throw new Error(\"type is required\");\n  }\n  if (!config.businessId) {\n    // throw new Error(\"businessId is required\");\n    config.businessId = \"test\";\n    console.warn(\"没有传入 businessId 参数，默认使用: test\");\n  }\n  if (!config.API) {\n    // throw new Error(\"API is required\");\n    config.API = \"http://api.links123.net/comment/v1\";\n    console.warn(\n      \"没有传入 API 参数，默认使用: http://api.links123.net/comment/v1\"\n    );\n  }\n\n  ReactDOM.render(<Index {...config} />, document.getElementById(config.id));\n  // registerServiceWorker();\n}\n\nwindow.renderComment = renderComment;\n\nif (process.env.NODE_ENV !== \"production\") {\n  renderComment({\n    id: \"root-comment\",\n    type: 1,\n    businessId: \"test\",\n    businessUserId: 4,\n    userId: 71299,\n    onCountChange: c => {\n      console.log(c);\n    },\n    editorProps: {\n      // emojiPopoverPlacement: \"bottom\",\n      uploadPopoverPlacement: \"top\"\n    }\n  });\n}\n\n// renderComment({\n//   id: \"root-comment\",\n//   type: 1,\n//   businessId: \"test\",\n//   API: 'http://api.links123.net/comment/v1',\n// });\n"]}
+{"version":3,"sources":["../src/index.js"],"names":["Index","props","editorProps","renderComment","config","id","Error","type","businessId","console","warn","API","ReactDOM","render","document","getElementById","window","process","env","NODE_ENV","businessUserId","userId","onCountChange","log","c"],"mappings":";;;;AAAA;;;;AACA;;;;AACA;;;;;;AACA;;AAEA,IAAMA,QAAQ,SAARA,KAAQ;AAAA,SACZ;AAAC,iBAAD;AAAA,eAAK,sBAAL,EAAsB,oBAAtB,EAAqC,oBAArC,EAAoD,eAApD,IAAkEC,KAAlE;AACE,kCAAC,WAAD,aAAQ,WAAW,CAAnB,EAAsB,eAAtB,IAAoCA,MAAMC,WAA1C;AADF,GADY;AAAA,CAAd;;AAMA;;;;;;;;AAQA,SAASC,aAAT,CAAuBC,MAAvB,EAA+B;AAC7B,MAAI,CAACA,OAAOC,EAAZ,EAAgB;AACd,UAAM,IAAIC,KAAJ,CAAU,gBAAV,CAAN;AACD;AACD,MAAI,CAACF,OAAOG,IAAZ,EAAkB;AAChB,UAAM,IAAID,KAAJ,CAAU,kBAAV,CAAN;AACD;AACD,MAAI,CAACF,OAAOI,UAAZ,EAAwB;AACtB;AACAJ,WAAOI,UAAP,GAAoB,MAApB;AACAC,YAAQC,IAAR,CAAa,+BAAb;AACD;AACD,MAAI,CAACN,OAAOO,GAAZ,EAAiB;AACf;AACAP,WAAOO,GAAP,GAAa,oCAAb;AACAF,YAAQC,IAAR,CACE,sDADF;AAGD;;AAEDE,qBAASC,MAAT,CAAgB,8BAAC,KAAD,EAAWT,MAAX,CAAhB,EAAuCU,SAASC,cAAT,CAAwBX,OAAOC,EAA/B,CAAvC;AACA;AACD;;AAEDW,OAAOb,aAAP,GAAuBA,aAAvB;;AAEA,IAAIc,QAAQC,GAAR,CAAYC,QAAZ,KAAyB,YAA7B,EAA2C;AACzChB,gBAAc;AACZE,QAAI,cADQ;AAEZE,UAAM,CAFM;AAGZC,gBAAY,MAHA;AAIZY,oBAAgB,CAJJ;AAKZC,YAAQ,KALI;AAMZC,mBAAe,0BAAK;AAClBb,cAAQc,GAAR,CAAYC,CAAZ;AACD,KARW;AASZtB,iBAAa;AACX;AACA;AAFW;AATD,GAAd;AAcD;;AAED;AACA;AACA;AACA;AACA;AACA","file":"index.js","sourcesContent":["import React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport App, { Editor } from \"./App\";\n// import registerServiceWorker from \"./registerServiceWorker\";\n\nconst Index = props => (\n  <App showAlertComment showAlertReply showAlertFavor showError {...props}>\n    <Editor maxUpload={9} autoFocus {...props.editorProps} />\n  </App>\n);\n\n/**\n * 渲染评论组件\n * @param {object} config 编辑器配置\n *  - {string} id 渲染评论的DOM的 ID\n *  - {number} type 评论的 type\n *  - {string} businessId 评论的 businessId\n *  - {string} API, API 前缀, 默认 http://api.links123.net/comment/v1\n */\nfunction renderComment(config) {\n  if (!config.id) {\n    throw new Error(\"id is required\");\n  }\n  if (!config.type) {\n    throw new Error(\"type is required\");\n  }\n  if (!config.businessId) {\n    // throw new Error(\"businessId is required\");\n    config.businessId = \"test\";\n    console.warn(\"没有传入 businessId 参数，默认使用: test\");\n  }\n  if (!config.API) {\n    // throw new Error(\"API is required\");\n    config.API = \"http://api.links123.net/comment/v1\";\n    console.warn(\n      \"没有传入 API 参数，默认使用: http://api.links123.net/comment/v1\"\n    );\n  }\n\n  ReactDOM.render(<Index {...config} />, document.getElementById(config.id));\n  // registerServiceWorker();\n}\n\nwindow.renderComment = renderComment;\n\nif (process.env.NODE_ENV !== \"production\") {\n  renderComment({\n    id: \"root-comment\",\n    type: 1,\n    businessId: \"test\",\n    businessUserId: 4,\n    userId: 71299,\n    onCountChange: c => {\n      console.log(c);\n    },\n    editorProps: {\n      // emojiPopoverPlacement: \"bottom\",\n      // uploadPopoverPlacement: \"top\"\n    }\n  });\n}\n\n// renderComment({\n//   id: \"root-comment\",\n//   type: 1,\n//   businessId: \"test\",\n//   API: 'http://api.links123.net/comment/v1',\n// });\n"]}

lib/version.json

@@ -1,8 +1,8 @@
 {
     "name":       "comment",
-    "buildDate":  1560392257361,
+    "buildDate":  1560766889583,
     "version":    "1.0.4",
-    "numCommits": 143,
-    "hash":       "7a06eef",
+    "numCommits": 144,
+    "hash":       "39cb870",
     "dirty":      false
 }

src/components/Editor/index.js

@@ -79,7 +79,11 @@ class Editor extends React.Component {
    * @param {Array} fileList 文件列表
    */
   handleChangeFileList(fileList) {
-    this.setState({ fileList });
+    let list = fileList;
+    if (fileList.length > this.props.maxUpload) {
+      list = fileList.slice(0, this.props.maxUpload);
+    }
+    this.setState({ fileList: list });
   }
 
   /**

src/index.js

@@ -55,7 +55,7 @@ if (process.env.NODE_ENV !== "production") {
     },
     editorProps: {
       // emojiPopoverPlacement: "bottom",
-      uploadPopoverPlacement: "top"
+      // uploadPopoverPlacement: "top"
     }
   });
 }