Bladeren bron

Merge branch 'feature/enter' of Evo/comment into master

AdamFu 4 jaren geleden
bovenliggende
commit
9a188d5039

+ 1
- 0
lib/App.js Bestand weergeven

745
         sUpdateComment: this.sUpdateComment,
745
         sUpdateComment: this.sUpdateComment,
746
         handleEdit: this.handleEdit
746
         handleEdit: this.handleEdit
747
       });
747
       });
748
+
748
       return this.state.initDone && _react2.default.createElement(
749
       return this.state.initDone && _react2.default.createElement(
749
         _Comment.CommentContext.Provider,
750
         _Comment.CommentContext.Provider,
750
         { value: value },
751
         { value: value },

+ 1
- 1
lib/App.js.map
Diff onderdrukt omdat het te groot bestand
Bestand weergeven


+ 1
- 1
lib/components/EditComment/EditComment.js.map
Diff onderdrukt omdat het te groot bestand
Bestand weergeven


+ 30
- 4
lib/components/Editor/index.js Bestand weergeven

138
     _this.handlePaste = _this.handlePaste.bind(_this);
138
     _this.handlePaste = _this.handlePaste.bind(_this);
139
     _this.resetState = _this.resetState.bind(_this);
139
     _this.resetState = _this.resetState.bind(_this);
140
     _this.handleEmojiScroll = _this.handleEmojiScroll.bind(_this);
140
     _this.handleEmojiScroll = _this.handleEmojiScroll.bind(_this);
141
+    _this.handlePressEnter = _this.handlePressEnter.bind(_this);
141
     return _this;
142
     return _this;
142
   }
143
   }
143
 
144
 
400
       }
401
       }
401
       return true;
402
       return true;
402
     }
403
     }
404
+
405
+    /**
406
+     *  **处理Enter事件**
407
+     *  1. `allowEnterSubmit`为true时enter触发submit事件
408
+     *  2. `e.preventDefault`为了防止enter事件后仍触发换行
409
+     *  3. enter事件开启后,仍可以用`shift + enter`触发换行
410
+     *  -- evo 20200222
411
+     */
412
+
413
+  }, {
414
+    key: "handlePressEnter",
415
+    value: function handlePressEnter(e) {
416
+      if (this.props.allowEnterSubmit) {
417
+        if (!e.shiftKey) {
418
+          e.preventDefault();
419
+          this.handleSubmit();
420
+        }
421
+      }
422
+    }
403
   }, {
423
   }, {
404
     key: "render",
424
     key: "render",
405
     value: function render() {
425
     value: function render() {
431
       var inputValue = value || this.state.value;
451
       var inputValue = value || this.state.value;
432
       var uploadFileList = fileList || this.state.fileList;
452
       var uploadFileList = fileList || this.state.fileList;
433
       var isLogin = app.currentUser && (app.currentUser.user_id > 0 || app.currentUser.id > 0);
453
       var isLogin = app.currentUser && (app.currentUser.user_id > 0 || app.currentUser.id > 0);
454
+
434
       return _react2.default.createElement(
455
       return _react2.default.createElement(
435
         "div",
456
         "div",
436
         { className: "comment-editor-container", onPaste: this.handlePaste },
457
         { className: "comment-editor-container", onPaste: this.handlePaste },
449
             _react2.default.createElement(TextArea, {
470
             _react2.default.createElement(TextArea, {
450
               value: inputValue,
471
               value: inputValue,
451
               onChange: function onChange(e) {
472
               onChange: function onChange(e) {
452
-                return _this4.handleChange(e.target.value);
473
+                _this4.handleChange(e.target.value);
453
               },
474
               },
454
               rows: rows,
475
               rows: rows,
455
               placeholder: placeholder,
476
               placeholder: placeholder,
456
-              autoFocus: autoFocus
477
+              autoFocus: autoFocus,
478
+              onPressEnter: this.handlePressEnter
457
             }),
479
             }),
458
             _react2.default.createElement(
480
             _react2.default.createElement(
459
               "div",
481
               "div",
628
   imageToolIcon: _propTypes2.default.node,
650
   imageToolIcon: _propTypes2.default.node,
629
   showError: _propTypes2.default.bool,
651
   showError: _propTypes2.default.bool,
630
   onError: _propTypes2.default.func,
652
   onError: _propTypes2.default.func,
631
-  maxLength: _propTypes2.default.number
653
+  maxLength: _propTypes2.default.number,
654
+  // Enter事件相关
655
+  allowEnterSubmit: _propTypes2.default.bool
632
 };
656
 };
633
 
657
 
634
 Editor.defaultProps = {
658
 Editor.defaultProps = {
648
   showError: true,
672
   showError: true,
649
   maxLength: 5000,
673
   maxLength: 5000,
650
   app: {},
674
   app: {},
651
-  handleChangeFileList: function handleChangeFileList() {}
675
+  handleChangeFileList: function handleChangeFileList() {},
676
+  // Enter事件相关
677
+  allowEnterSubmit: false
652
 };
678
 };
653
 
679
 
654
 exports.default = (0, _Comment2.default)(Editor);
680
 exports.default = (0, _Comment2.default)(Editor);

+ 1
- 1
lib/components/Editor/index.js.map
Diff onderdrukt omdat het te groot bestand
Bestand weergeven


+ 3
- 4
lib/index.js Bestand weergeven

68
           fileList: this.state.fileList,
68
           fileList: this.state.fileList,
69
           value: this.state.value,
69
           value: this.state.value,
70
           onChange: function onChange(value) {
70
           onChange: function onChange(value) {
71
-            _this2.setState({
72
-              value: value
73
-            });
71
+            _this2.setState({ value: value });
74
           },
72
           },
75
           handleChangeFileList: function handleChangeFileList(fileList) {
73
           handleChangeFileList: function handleChangeFileList(fileList) {
76
             console.log("----", fileList);
74
             console.log("----", fileList);
77
             _this2.setState({
75
             _this2.setState({
78
               fileList: fileList
76
               fileList: fileList
79
             });
77
             });
80
-          }
78
+          },
79
+          allowEnterSubmit: true
81
         }))
80
         }))
82
       );
81
       );
83
     }
82
     }

+ 1
- 1
lib/index.js.map
Diff onderdrukt omdat het te groot bestand
Bestand weergeven


+ 4
- 4
lib/version.json Bestand weergeven

1
 {
1
 {
2
     "name":       "comment",
2
     "name":       "comment",
3
-    "buildDate":  1577536315907,
3
+    "buildDate":  1582351916030,
4
     "version":    "1.0.4",
4
     "version":    "1.0.4",
5
-    "numCommits": 197,
6
-    "hash":       "92e9ffb",
7
-    "dirty":      true
5
+    "numCommits": 201,
6
+    "hash":       "556bf1c",
7
+    "dirty":      false
8
 }
8
 }

+ 13
- 17
src/components/Editor/index.js Bestand weergeven

60
       fileMap: {}, // 已经上传的图片路径和 uid 的映射 { uid: path }
60
       fileMap: {}, // 已经上传的图片路径和 uid 的映射 { uid: path }
61
       uploadVisible: false
61
       uploadVisible: false
62
     };
62
     };
63
+    this.handleChange = this.handleChange.bind(this);
63
     this.handleClickEmoji = this.handleClickEmoji.bind(this);
64
     this.handleClickEmoji = this.handleClickEmoji.bind(this);
64
     this.handleChangeFileList = this.handleChangeFileList.bind(this);
65
     this.handleChangeFileList = this.handleChangeFileList.bind(this);
65
     this.handleShowUpload = this.handleShowUpload.bind(this);
66
     this.handleShowUpload = this.handleShowUpload.bind(this);
68
     this.handlePaste = this.handlePaste.bind(this);
69
     this.handlePaste = this.handlePaste.bind(this);
69
     this.resetState = this.resetState.bind(this);
70
     this.resetState = this.resetState.bind(this);
70
     this.handleEmojiScroll = this.handleEmojiScroll.bind(this);
71
     this.handleEmojiScroll = this.handleEmojiScroll.bind(this);
72
+    this.handlePressEnter = this.handlePressEnter.bind(this);
71
   }
73
   }
72
 
74
 
73
   componentDidMount() {
75
   componentDidMount() {
74
-    const { app, onRef, allowEnter, onPressEnter } = this.props;
76
+    const { app, onRef } = this.props;
75
     if (
77
     if (
76
       app.currentUser &&
78
       app.currentUser &&
77
       (app.currentUser.user_id > 0 || app.currentUser.id > 0)
79
       (app.currentUser.user_id > 0 || app.currentUser.id > 0)
81
     if (isFunction(onRef)) {
83
     if (isFunction(onRef)) {
82
       onRef(this);
84
       onRef(this);
83
     }
85
     }
84
-
85
-    if ((allowEnter && !onPressEnter) || (!allowEnter && onPressEnter))
86
-      console.error("`onPressEnter` must be undefined when `allowEnter`!");
87
   }
86
   }
88
 
87
 
89
   handleEmojiScroll(e) {
88
   handleEmojiScroll(e) {
103
    * 将最新的值存储到 state 中
102
    * 将最新的值存储到 state 中
104
    * @param {string} value 输入的值
103
    * @param {string} value 输入的值
105
    */
104
    */
106
-  handleChange = value => {
105
+  handleChange(value) {
107
     this.setState({ value });
106
     this.setState({ value });
108
     if (this.props.onChange) {
107
     if (this.props.onChange) {
109
       this.props.onChange(value);
108
       this.props.onChange(value);
110
     }
109
     }
111
-  };
110
+  }
112
 
111
 
113
   /**
112
   /**
114
    * 点击 emoji 的事件
113
    * 点击 emoji 的事件
298
 
297
 
299
   /**
298
   /**
300
    *  **处理Enter事件**
299
    *  **处理Enter事件**
301
-   *  1. `allowEnter` & `onPressEnter`同时有效时才能触发
300
+   *  1. `allowEnterSubmit`为true时enter触发submit事件
302
    *  2. `e.preventDefault`为了防止enter事件后仍触发换行
301
    *  2. `e.preventDefault`为了防止enter事件后仍触发换行
303
-   *  3. enter事件开启,仍可以用`shift + enter`触发换行
302
+   *  3. enter事件开启,仍可以用`shift + enter`触发换行
304
    *  -- evo 20200222
303
    *  -- evo 20200222
305
    */
304
    */
306
-  handlePressEnter = e => {
307
-    const { allowEnter, onPressEnter } = this.props;
308
-    if (allowEnter && onPressEnter) {
305
+  handlePressEnter(e) {
306
+    if (this.props.allowEnterSubmit) {
309
       if (!e.shiftKey) {
307
       if (!e.shiftKey) {
310
         e.preventDefault();
308
         e.preventDefault();
311
-        onPressEnter();
309
+        this.handleSubmit();
312
       }
310
       }
313
     }
311
     }
314
-  };
312
+  }
315
 
313
 
316
   render() {
314
   render() {
317
     const {
315
     const {
530
   onError: PropTypes.func,
528
   onError: PropTypes.func,
531
   maxLength: PropTypes.number,
529
   maxLength: PropTypes.number,
532
   // Enter事件相关
530
   // Enter事件相关
533
-  allowEnter: PropTypes.bool,
534
-  onPressEnter: PropTypes.func
531
+  allowEnterSubmit: PropTypes.bool
535
 };
532
 };
536
 
533
 
537
 Editor.defaultProps = {
534
 Editor.defaultProps = {
553
   app: {},
550
   app: {},
554
   handleChangeFileList: () => {},
551
   handleChangeFileList: () => {},
555
   // Enter事件相关
552
   // Enter事件相关
556
-  allowEnter: false,
557
-  onPressEnter: undefined
553
+  allowEnterSubmit: false
558
 };
554
 };
559
 
555
 
560
 export default Comment(Editor);
556
 export default Comment(Editor);

+ 1
- 2
src/index.js Bestand weergeven

43
               fileList
43
               fileList
44
             });
44
             });
45
           }}
45
           }}
46
-          allowEnter
47
-          onPressEnter={e => alert("enter pressed")}
46
+          allowEnterSubmit
48
         />
47
         />
49
       </App>
48
       </App>
50
     );
49
     );