v0.5.5

CHANGELOG.md

@@ -1,5 +1,10 @@
 # CHANGELOG
 
+## 0.5.5
+
+- [x] 增加删除评论、回复功能
+- [x] 错误回调onError增加info:{ response } 参数
+
 ## 0.5.4
 
 - [x] 暂无昵称 -> 游客

README.md

@@ -2,7 +2,7 @@
 
 通用评论系统及编辑器
 
-**`version 0.5.4`**
+**`version 0.5.5`**
 
 ```js
 import Comment, { Editor, RenderText } from 'comment';
@@ -13,20 +13,20 @@ import Comment, { Editor, RenderText } from 'comment';
 ## Comment
 
 
-| props            | type          | default                            | required | description                                                  |
-| ---------------- | ------------- | ---------------------------------- | -------- | ------------------------------------------------------------ |
-| type             | number        |                                    | true     | 评论的 type                                                  |
-| businessId       | string        |                                    | true     | 评论的 business id                                           |
-| API              | string        | http://api.links123.net/comment/v1 | false    | API 前缀                                                     |
-| showList         | boolean       | true                               | false    | 是否显示评论列表                                             |
-| showEditor       | boolean       | true                               | false    | 是否显示评论输入框                                           |
-| showAlertComment | boolean       | false                              | false    | 评论成功之后，是否通过 Antd 的 Message 组件进行提示          |
-| showAlertReply   | boolean       | false                              | false    | 回复成功之后，是否通过 Antd 的 Message 组件进行提示          |
-| showAlertFavor   | boolean       | false                              | false    | 点赞/取消点赞成功之后，是否通过 Antd 的 Message 组件进行提示 |
-| showError        | boolean       | true                               | false    | 是否使用Antd的Message组件提示错误信息                        |
-| onError          | function(msg) |                                    | false    | 错误回调, 出错了会被调用                                     |
-| token            | string        |                                    | false    | [deprecated] token，用于身份认证，非必须。默认使用 cookie    |
-
+| props            | type          | default                            | required | description                                                                       |
+| ---------------- | ------------- | ---------------------------------- | -------- | --------------------------------------------------------------------------------- |
+| type             | number        |                                    | true     | 评论的 type                                                                       |
+| businessId       | string        |                                    | true     | 评论的 business id                                                                |
+| API              | string        | http://api.links123.net/comment/v1 | false    | API 前缀                                                                          |
+| showList         | boolean       | true                               | false    | 是否显示评论列表                                                                  |
+| showEditor       | boolean       | true                               | false    | 是否显示评论输入框                                                                |
+| showAlertComment | boolean       | false                              | false    | 评论成功之后，是否通过 Antd 的 Message 组件进行提示                               |
+| showAlertReply   | boolean       | false                              | false    | 回复成功之后，是否通过 Antd 的 Message 组件进行提示                               |
+| showAlertFavor   | boolean       | false                              | false    | 点赞/取消点赞成功之后，是否通过 Antd 的 Message 组件进行提示                      |
+| showError        | boolean       | true                               | false    | 是否使用Antd的Message组件提示错误信息                                             |
+| onError          | function(msg) |                                    | false    | 错误回调, 出错了会被调用                                                          |
+| userId           | number        |                                    | false    | 用户id, comment内部不维护用户id, 调用组件时传递过来, 目前用于判断是否显示删除按钮 |
+| token            | string        |                                    | false    | [deprecated] token，用于身份认证，非必须。默认使用 cookie                         |
 
 
 ## Editor
@@ -52,7 +52,7 @@ import Comment, { Editor, RenderText } from 'comment';
 | onRef               | function                        |               | false    | 传递子组件的引用                                                                                  |
 | closeUploadWhenBlur | boolean                         |               | false    | 当 upload 失去焦点（鼠标点击非 Upload 的区域）的时候，是否自动关闭 Popover                        |
 | showError           | boolean                         | true          | false    | 是否使用Antd的Message组件提示错误信息, 主要是上传图片出错的情况                                   |
-| onError             | function(msg)                   |               | false    | 错误回调, 出错了会被调用, 主要是上传图片出错的情况                                                |
+| onError             | function(msg,{response})        |               | false    | 错误回调, 出错了会被调用, 主要是上传图片出错的情况                                                |
 
 
 
@@ -265,4 +265,4 @@ $ yarn start
 - [x] oss/sts 接口报错
 - [ ] 头像 404 `https://links123-images.oss-cn-hangzhou.aliyuncs.com/avatar/`
 - [ ] 上传图片的时候偶尔会出现InvalidPart
-
+- [ ] 上传图片失败时, 提示并且不显示缩略图

lib/App.js

@@ -85,12 +85,15 @@ var App = function (_Component) {
       isNoMoreComment: false
     };
     _this.handleChangeLoading = _this.handleChangeLoading.bind(_this);
-    _this.sGetComment = _this.sGetComment.bind(_this);
-    _this.sGetReply = _this.sGetReply.bind(_this);
     _this.sCreateComment = _this.sCreateComment.bind(_this);
-    _this.sCreateReply = _this.sCreateReply.bind(_this);
+    _this.sDeleteComment = _this.sDeleteComment.bind(_this);
     _this.sCommentFavor = _this.sCommentFavor.bind(_this);
+    _this.sCreateReply = _this.sCreateReply.bind(_this);
+    _this.sDeleteReply = _this.sDeleteReply.bind(_this);
+    _this.errorHandler = _this.errorHandler.bind(_this);
+    _this.sGetComment = _this.sGetComment.bind(_this);
     _this.sReplyFavor = _this.sReplyFavor.bind(_this);
+    _this.sGetReply = _this.sGetReply.bind(_this);
     _this.sOssSts = _this.sOssSts.bind(_this);
     return _this;
   }
@@ -110,12 +113,23 @@ var App = function (_Component) {
   }, {
     key: "error",
     value: function error(msg) {
+      var info = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+
       if (this.props.showError) {
         _message3.default.error(msg);
       }
       if (this.props.onError) {
-        this.props.onError(msg);
+        this.props.onError(msg, info);
+      }
+    }
+  }, {
+    key: "errorHandler",
+    value: function errorHandler(error) {
+      if (error.response && error.response.data && error.response.data.msg) {
+        this.error(_lang2.default[error.response.data.msg] || _constant.ERROR_DEFAULT, { response: error.response });
+        return;
       }
+      this.error(_lang2.default[error.message] || _constant.ERROR_DEFAULT, { response: error.response });
     }
 
     /**
@@ -180,13 +194,7 @@ var App = function (_Component) {
             isNoMoreComment: true
           });
         }
-      }).catch(function (error) {
-        if (error.response && error.response.data && error.response.data.msg) {
-          _this2.error(_lang2.default[error.response.data.msg] || _constant.ERROR_DEFAULT);
-          return;
-        }
-        _this2.error(_lang2.default[error.message] || _constant.ERROR_DEFAULT);
-      }).finally(function () {
+      }).catch(this.errorHandler).finally(function () {
         _this2.handleChangeLoading("sGetComment", false);
       });
     }
@@ -235,13 +243,7 @@ var App = function (_Component) {
           return item;
         });
         _this3.setState({ list: list });
-      }).catch(function (error) {
-        if (error.response && error.response.data && error.response.data.msg) {
-          _this3.error(_lang2.default[error.response.data.msg] || _constant.ERROR_DEFAULT);
-          return;
-        }
-        _this3.error(_lang2.default[error.message] || _constant.ERROR_DEFAULT);
-      }).finally(function () {
+      }).catch(this.errorHandler).finally(function () {
         _this3.handleChangeLoading("sGetReply", false);
       });
     }
@@ -292,17 +294,40 @@ var App = function (_Component) {
           isTemporary: true // 临时的数据
         }));
         _this4.setState({ list: list, total: total + 1 });
-      }).catch(function (error) {
-        if (error.response && error.response.data && error.response.data.msg) {
-          _this4.error(_lang2.default[error.response.data.msg] || _constant.ERROR_DEFAULT);
-          return;
-        }
-        _this4.error(_lang2.default[error.message] || _constant.ERROR_DEFAULT);
-      }).finally(function () {
+      }).catch(this.errorHandler).finally(function () {
         _this4.handleChangeLoading("sCreateComment", false);
       });
     }
 
+    /**
+     * 删除评论
+     */
+
+  }, {
+    key: "sDeleteComment",
+    value: function sDeleteComment(commentId) {
+      var _this5 = this;
+
+      this.handleChangeLoading("sDeleteComment", true);
+      var API = this.props.API;
+
+      this.axios(API + "/comments/" + commentId, {
+        method: "delete",
+        withCredentials: true
+      }).then(function () {
+        var _state2 = _this5.state,
+            list = _state2.list,
+            total = _state2.total;
+
+        var res = list.filter(function (item) {
+          return item.id !== commentId;
+        });
+        _this5.setState({ list: res, total: total - 1 });
+      }).catch(this.errorHandler).finally(function () {
+        _this5.handleChangeLoading("sDeleteComment", false);
+      });
+    }
+
     /**
      * 添加回复
      * 回复评论/回复回复
@@ -312,7 +337,7 @@ var App = function (_Component) {
   }, {
     key: "sCreateReply",
     value: function sCreateReply(data, cb) {
-      var _this5 = this;
+      var _this6 = this;
 
       if (!data.content) return this.error("回复内容不能为空 ");
       this.handleChangeLoading("sCreateReply", true);
@@ -323,14 +348,14 @@ var App = function (_Component) {
         data: data,
         withCredentials: true
       }).then(function (response) {
-        if (_this5.props.showAlertReply) {
+        if (_this6.props.showAlertReply) {
           _message3.default.success("回复成功！");
         }
         if ((0, _helper.isFunction)(cb)) cb();
         // 将数据写入到 list 中
         // 临时插入
         // 等到获取数据之后，删除临时数据
-        var list = _this5.state.list.map(function (item) {
+        var list = _this6.state.list.map(function (item) {
           if (item.id === data.comment_id) {
             if (!item.replies) item.replies = [];
             item.replies.push(_extends({}, response.data, {
@@ -340,15 +365,43 @@ var App = function (_Component) {
           }
           return item;
         });
-        _this5.setState({ list: list });
-      }).catch(function (error) {
-        if (error.response && error.response.data && error.response.data.msg) {
-          _this5.error(_lang2.default[error.response.data.msg] || _constant.ERROR_DEFAULT);
-          return;
-        }
-        _this5.error(_lang2.default[error.message] || _constant.ERROR_DEFAULT);
-      }).finally(function () {
-        _this5.handleChangeLoading("sCreateReply", false);
+        _this6.setState({ list: list });
+      }).catch(this.errorHandler).finally(function () {
+        _this6.handleChangeLoading("sCreateReply", false);
+      });
+    }
+
+    /**
+     * 删除回复
+     * @param {*} replyId 
+     * @param {*} commentId 
+     */
+
+  }, {
+    key: "sDeleteReply",
+    value: function sDeleteReply(replyId, commentId) {
+      var _this7 = this;
+
+      this.handleChangeLoading("sDeleteReply", true);
+      var API = this.props.API;
+
+      this.axios(API + "/replies/" + replyId + "?CommentID=" + commentId, {
+        method: "delete",
+        withCredentials: true
+      }).then(function () {
+        var list = _this7.state.list.map(function (item) {
+          if (item.id === commentId) {
+            var replies = item.replies.filter(function (item) {
+              return item.id !== replyId;
+            });
+            item.replies = replies;
+            item.reply_count -= 1;
+          }
+          return item;
+        });
+        _this7.setState({ list: list });
+      }).catch(this.errorHandler).finally(function () {
+        _this7.handleChangeLoading("sDeleteReply", false);
       });
     }
 
@@ -361,7 +414,7 @@ var App = function (_Component) {
   }, {
     key: "sCommentFavor",
     value: function sCommentFavor(commentId, favored) {
-      var _this6 = this;
+      var _this8 = this;
 
       this.handleChangeLoading("sCommentFavor", true);
       var API = this.props.API;
@@ -370,26 +423,20 @@ var App = function (_Component) {
         method: favored ? "delete" : "put",
         withCredentials: true
       }).then(function (response) {
-        if (_this6.props.showAlertFavor) {
+        if (_this8.props.showAlertFavor) {
           _message3.default.success(favored ? "取消点赞成功！" : "点赞成功！");
         }
         // 更新 list 中的该项数据的 favored
-        var list = _this6.state.list.map(function (item) {
+        var list = _this8.state.list.map(function (item) {
           if (item.id === commentId) {
             item.favored = !favored;
             item.favor_count += favored ? -1 : 1;
           }
           return item;
         });
-        _this6.setState({ list: list });
-      }).catch(function (error) {
-        if (error.response && error.response.data && error.response.data.msg) {
-          _this6.error(_lang2.default[error.response.data.msg] || _constant.ERROR_DEFAULT);
-          return;
-        }
-        _this6.error(_lang2.default[error.message] || _constant.ERROR_DEFAULT);
-      }).finally(function () {
-        _this6.handleChangeLoading("sCommentFavor", false);
+        _this8.setState({ list: list });
+      }).catch(this.errorHandler).finally(function () {
+        _this8.handleChangeLoading("sCommentFavor", false);
       });
     }
 
@@ -403,7 +450,7 @@ var App = function (_Component) {
   }, {
     key: "sReplyFavor",
     value: function sReplyFavor(replyId, commentId, favored) {
-      var _this7 = this;
+      var _this9 = this;
 
       this.handleChangeLoading("sReplyFavor", true);
       var API = this.props.API;
@@ -417,7 +464,7 @@ var App = function (_Component) {
       }).then(function (response) {
         _message3.default.success(favored ? "取消点赞成功！" : "点赞成功！");
         // 更新 list 中的该项数据的 favored
-        var list = _this7.state.list.map(function (item) {
+        var list = _this9.state.list.map(function (item) {
           if (item.id === commentId) {
             item.replies = item.replies.map(function (r) {
               if (r.id === replyId) {
@@ -432,15 +479,9 @@ var App = function (_Component) {
           }
           return item;
         });
-        _this7.setState({ list: list });
-      }).catch(function (error) {
-        if (error.response && error.response.data && error.response.data.msg) {
-          _this7.error(_lang2.default[error.response.data.msg] || _constant.ERROR_DEFAULT);
-          return;
-        }
-        _this7.error(_lang2.default[error.message] || _constant.ERROR_DEFAULT);
-      }).finally(function () {
-        _this7.handleChangeLoading("sReplyFavor", false);
+        _this9.setState({ list: list });
+      }).catch(this.errorHandler).finally(function () {
+        _this9.handleChangeLoading("sReplyFavor", false);
       });
     }
 
@@ -451,21 +492,15 @@ var App = function (_Component) {
   }, {
     key: "sOssSts",
     value: function sOssSts() {
-      var _this8 = this;
+      var _this10 = this;
 
       this.handleChangeLoading("sOssSts", true);
       var API = this.props.API;
 
       this.axios.get(API + "/oss/sts").then(function (response) {
-        _this8.setState({ oss: _extends({}, response.data) });
-      }).catch(function (error) {
-        if (error.response && error.response.data && error.response.data.msg) {
-          _this8.error(_lang2.default[error.response.data.msg] || _constant.ERROR_DEFAULT);
-          return;
-        }
-        _this8.error(_lang2.default[error.message] || _constant.ERROR_DEFAULT);
-      }).finally(function () {
-        _this8.handleChangeLoading("sOssSts", false);
+        _this10.setState({ oss: _extends({}, response.data) });
+      }).catch(this.errorHandler).finally(function () {
+        _this10.handleChangeLoading("sOssSts", false);
       });
     }
   }, {
@@ -479,7 +514,9 @@ var App = function (_Component) {
         sReplyFavor: this.sReplyFavor,
         sCreateReply: this.sCreateReply,
         sGetReply: this.sGetReply,
-        sOssSts: this.sOssSts
+        sOssSts: this.sOssSts,
+        sDeleteComment: this.sDeleteComment,
+        sDeleteReply: this.sDeleteReply
       });
 
       return _react2.default.createElement(
@@ -512,7 +549,8 @@ App.propTypes = {
   showAlertReply: _propTypes2.default.bool, // 回复成功之后，是否通过 Antd 的 Message 组件进行提示
   showAlertFavor: _propTypes2.default.bool, // 点赞/取消点赞成功之后，是否通过 Antd 的 Message 组件进行提示
   showError: _propTypes2.default.bool, // 是否使用Antd的Message组件提示错误信息
-  onError: _propTypes2.default.func // 错误回调, 出错了会被调用
+  onError: _propTypes2.default.func, // 错误回调, 出错了会被调用
+  userId: _propTypes2.default.number // 用户id, comment内部不维护用户id, 调用组件时传递过来, 目前用于判断是否显示删除按钮
 };
 
 App.defaultProps = {

lib/components/ContentItem/index.js

@@ -4,6 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
+var _popconfirm = require("antd/es/popconfirm");
+
+var _popconfirm2 = _interopRequireDefault(_popconfirm);
+
 var _icon = require("antd/es/icon");
 
 var _icon2 = _interopRequireDefault(_icon);
@@ -18,6 +22,8 @@ var _avatar2 = _interopRequireDefault(_avatar);
 
 var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
 
+require("antd/es/popconfirm/style/css");
+
 require("antd/es/icon/style/css");
 
 require("antd/es/tooltip/style/css");
@@ -201,6 +207,23 @@ var CommentItem = function (_Component) {
                 showReply ? _react2.default.createElement(_icon2.default, { type: "up" }) : _react2.default.createElement(_icon2.default, { type: "down" })
               )
             ) : null,
+            app.userId === content.user_id && _react2.default.createElement(
+              _popconfirm2.default,
+              { title: "\u786E\u5B9A\u8981\u5220\u9664\u5417?", onConfirm: function onConfirm() {
+                  if (replyId) {
+                    app.sDeleteReply(content.id, commentId);
+                    return;
+                  }
+                  app.sDeleteComment(content.id);
+                }, okText: "\u786E\u5B9A", cancelText: "\u53D6\u6D88" },
+              _react2.default.createElement(
+                "a",
+                {
+                  className: "comment-item-bottom-right"
+                },
+                "\xA0 \u5220\u9664"
+              )
+            ),
             _react2.default.createElement(
               "a",
               {

lib/components/Editor/Upload.js

@@ -150,7 +150,7 @@ var App = function (_React$Component) {
             _message3.default.error(msg);
           }
           if (_this2.props.onError) {
-            _this2.props.onError(msg);
+            _this2.props.onError(msg, { response: e.response });
           }
           info.onError(e);
         });

lib/index.js

@@ -81,7 +81,13 @@ var Index = function (_Component) {
           showAlertReply: true,
           showAlertFavor: true,
           showError: false,
-          onError: function onError(msg) {
+          userId: 71299,
+          onError: function onError(msg, _ref2) {
+            var response = _ref2.response;
+
+            if (response.status === 401) {
+              console.log("unlogined");
+            }
             console.log("-----------" + msg);
           }
         },
@@ -96,7 +102,12 @@ var Index = function (_Component) {
             console.log("succ");
           },
           showError: false,
-          onError: function onError(msg) {
+          onError: function onError(msg, _ref3) {
+            var response = _ref3.response;
+
+            if (response.status === 401) {
+              console.log("unlogined");
+            }
             console.log("-----------" + msg);
           }
         })

package.json

@@ -1,6 +1,6 @@
 {
   "name": "comment",
-  "version": "0.5.4",
+  "version": "0.5.5",
   "main": "lib/App.js",
   "description": "通用评论",
   "keywords": [

src/App.js

@@ -29,12 +29,15 @@ class App extends Component {
       isNoMoreComment: false
     };
     this.handleChangeLoading = this.handleChangeLoading.bind(this);
-    this.sGetComment = this.sGetComment.bind(this);
-    this.sGetReply = this.sGetReply.bind(this);
     this.sCreateComment = this.sCreateComment.bind(this);
-    this.sCreateReply = this.sCreateReply.bind(this);
+    this.sDeleteComment = this.sDeleteComment.bind(this);
     this.sCommentFavor = this.sCommentFavor.bind(this);
+    this.sCreateReply = this.sCreateReply.bind(this);
+    this.sDeleteReply = this.sDeleteReply.bind(this);
+    this.errorHandler = this.errorHandler.bind(this);
+    this.sGetComment = this.sGetComment.bind(this);
     this.sReplyFavor = this.sReplyFavor.bind(this);
+    this.sGetReply = this.sGetReply.bind(this);
     this.sOssSts = this.sOssSts.bind(this);
   }
 
@@ -50,15 +53,27 @@ class App extends Component {
 
   componentDidMount() {}
 
-  error(msg) {
+  error(msg, info = {}) {
     if (this.props.showError) {
       message.error(msg);
     }
     if (this.props.onError) {
-      this.props.onError(msg);
+      this.props.onError(msg, info);
     }
   }
 
+  errorHandler(error) {
+    if (error.response && error.response.data && error.response.data.msg) {
+      this.error(lang[error.response.data.msg] || ERROR_DEFAULT, {
+        response: error.response
+      });
+      return;
+    }
+    this.error(lang[error.message] || ERROR_DEFAULT, {
+      response: error.response
+    });
+  }
+
   /**
    * 改变 loading 状态
    * @param {string} key key
@@ -102,13 +117,7 @@ class App extends Component {
           });
         }
       })
-      .catch(error => {
-        if (error.response && error.response.data && error.response.data.msg) {
-          this.error(lang[error.response.data.msg] || ERROR_DEFAULT);
-          return;
-        }
-        this.error(lang[error.message] || ERROR_DEFAULT);
-      })
+      .catch(this.errorHandler)
       .finally(() => {
         this.handleChangeLoading("sGetComment", false);
       });
@@ -150,13 +159,7 @@ class App extends Component {
         });
         this.setState({ list });
       })
-      .catch(error => {
-        if (error.response && error.response.data && error.response.data.msg) {
-          this.error(lang[error.response.data.msg] || ERROR_DEFAULT);
-          return;
-        }
-        this.error(lang[error.message] || ERROR_DEFAULT);
-      })
+      .catch(this.errorHandler)
       .finally(() => {
         this.handleChangeLoading("sGetReply", false);
       });
@@ -194,18 +197,33 @@ class App extends Component {
         });
         this.setState({ list, total: total + 1 });
       })
-      .catch(error => {
-        if (error.response && error.response.data && error.response.data.msg) {
-          this.error(lang[error.response.data.msg] || ERROR_DEFAULT);
-          return;
-        }
-        this.error(lang[error.message] || ERROR_DEFAULT);
-      })
+      .catch(this.errorHandler)
       .finally(() => {
         this.handleChangeLoading("sCreateComment", false);
       });
   }
 
+  /**
+   * 删除评论
+   */
+  sDeleteComment(commentId) {
+    this.handleChangeLoading("sDeleteComment", true);
+    const { API } = this.props;
+    this.axios(`${API}/comments/${commentId}`, {
+      method: "delete",
+      withCredentials: true
+    })
+      .then(() => {
+        const { list, total } = this.state;
+        const res = list.filter(item => item.id !== commentId);
+        this.setState({ list: res, total: total - 1 });
+      })
+      .catch(this.errorHandler)
+      .finally(() => {
+        this.handleChangeLoading("sDeleteComment", false);
+      });
+  }
+
   /**
    * 添加回复
    * 回复评论/回复回复
@@ -241,18 +259,41 @@ class App extends Component {
         });
         this.setState({ list });
       })
-      .catch(error => {
-        if (error.response && error.response.data && error.response.data.msg) {
-          this.error(lang[error.response.data.msg] || ERROR_DEFAULT);
-          return;
-        }
-        this.error(lang[error.message] || ERROR_DEFAULT);
-      })
+      .catch(this.errorHandler)
       .finally(() => {
         this.handleChangeLoading("sCreateReply", false);
       });
   }
 
+  /**
+   * 删除回复
+   * @param {*} replyId
+   * @param {*} commentId
+   */
+  sDeleteReply(replyId, commentId) {
+    this.handleChangeLoading("sDeleteReply", true);
+    const { API } = this.props;
+    this.axios(`${API}/replies/${replyId}?CommentID=${commentId}`, {
+      method: "delete",
+      withCredentials: true
+    })
+      .then(() => {
+        const list = this.state.list.map(item => {
+          if (item.id === commentId) {
+            const replies = item.replies.filter(item => item.id !== replyId);
+            item.replies = replies;
+            item.reply_count -= 1;
+          }
+          return item;
+        });
+        this.setState({ list });
+      })
+      .catch(this.errorHandler)
+      .finally(() => {
+        this.handleChangeLoading("sDeleteReply", false);
+      });
+  }
+
   /**
    * 评论 点赞/取消点赞
    * @param {string} commentId { commentId }
@@ -279,13 +320,7 @@ class App extends Component {
         });
         this.setState({ list });
       })
-      .catch(error => {
-        if (error.response && error.response.data && error.response.data.msg) {
-          this.error(lang[error.response.data.msg] || ERROR_DEFAULT);
-          return;
-        }
-        this.error(lang[error.message] || ERROR_DEFAULT);
-      })
+      .catch(this.errorHandler)
       .finally(() => {
         this.handleChangeLoading("sCommentFavor", false);
       });
@@ -327,13 +362,7 @@ class App extends Component {
         });
         this.setState({ list });
       })
-      .catch(error => {
-        if (error.response && error.response.data && error.response.data.msg) {
-          this.error(lang[error.response.data.msg] || ERROR_DEFAULT);
-          return;
-        }
-        this.error(lang[error.message] || ERROR_DEFAULT);
-      })
+      .catch(this.errorHandler)
       .finally(() => {
         this.handleChangeLoading("sReplyFavor", false);
       });
@@ -350,13 +379,7 @@ class App extends Component {
       .then(response => {
         this.setState({ oss: { ...response.data } });
       })
-      .catch(error => {
-        if (error.response && error.response.data && error.response.data.msg) {
-          this.error(lang[error.response.data.msg] || ERROR_DEFAULT);
-          return;
-        }
-        this.error(lang[error.message] || ERROR_DEFAULT);
-      })
+      .catch(this.errorHandler)
       .finally(() => {
         this.handleChangeLoading("sOssSts", false);
       });
@@ -373,7 +396,9 @@ class App extends Component {
       sReplyFavor: this.sReplyFavor,
       sCreateReply: this.sCreateReply,
       sGetReply: this.sGetReply,
-      sOssSts: this.sOssSts
+      sOssSts: this.sOssSts,
+      sDeleteComment: this.sDeleteComment,
+      sDeleteReply: this.sDeleteReply
     };
 
     return (
@@ -403,7 +428,8 @@ App.propTypes = {
   showAlertReply: PropTypes.bool, // 回复成功之后，是否通过 Antd 的 Message 组件进行提示
   showAlertFavor: PropTypes.bool, // 点赞/取消点赞成功之后，是否通过 Antd 的 Message 组件进行提示
   showError: PropTypes.bool, // 是否使用Antd的Message组件提示错误信息
-  onError: PropTypes.func // 错误回调, 出错了会被调用
+  onError: PropTypes.func, // 错误回调, 出错了会被调用
+  userId: PropTypes.number // 用户id, comment内部不维护用户id, 调用组件时传递过来, 目前用于判断是否显示删除按钮
 };
 
 App.defaultProps = {

src/components/ContentItem/index.js

@@ -1,6 +1,6 @@
 import React, { Component } from "react";
 import PropTypes from "prop-types";
-import { Avatar, Icon, Tooltip } from "antd";
+import { Avatar, Icon, Tooltip, Popconfirm } from "antd";
 import dayjs from "dayjs";
 import "dayjs/locale/zh-cn";
 import relativeTime from "dayjs/plugin/relativeTime";
@@ -121,7 +121,22 @@ class CommentItem extends Component {
                 </a>
               </div>
             ) : null}
-
+            {app.userId === content.user_id && (
+              <Popconfirm
+                title="确定要删除吗?"
+                onConfirm={() => {
+                  if (replyId) {
+                    app.sDeleteReply(content.id, commentId);
+                    return;
+                  }
+                  app.sDeleteComment(content.id);
+                }}
+                okText="确定"
+                cancelText="取消"
+              >
+                <a className="comment-item-bottom-right">&nbsp; 删除</a>
+              </Popconfirm>
+            )}
             <a
               onClick={this.handleToggleInput}
               className="comment-item-bottom-right"

src/components/Editor/Upload.js

@@ -93,7 +93,7 @@ class App extends React.Component {
             message.error(msg);
           }
           if (this.props.onError) {
-            this.props.onError(msg);
+            this.props.onError(msg, { response: e.response });
           }
           info.onError(e);
         });

src/index.js

@@ -41,7 +41,11 @@ class Index extends Component {
         showAlertReply
         showAlertFavor
         showError={false}
-        onError={msg => {
+        userId={71299}
+        onError={(msg, { response }) => {
+          if (response.status === 401) {
+            console.log("unlogined");
+          }
           console.log(`-----------${msg}`);
         }}
       >
@@ -56,7 +60,10 @@ class Index extends Component {
             console.log("succ");
           }}
           showError={false}
-          onError={msg => {
+          onError={(msg, { response }) => {
+            if (response.status === 401) {
+              console.log("unlogined");
+            }
             console.log(`-----------${msg}`);
           }}
         />