コメントを削除した後にコールバックが機能しません。 REACT

Question

コメントを削除しても問題ありませんが、何らかの理由でコールバックが呼び出されていません。関数に複数の引数を渡す方法は多分ありますが、わかりません。

この問題を解決するために、以下のコードを投稿します。

を表示するページ：

renderCommentsButtons(comment) { 
    const { post, user, auth } = this.props; 

    if(!user) { 
     return (<div></div>); 
    } 

    if(auth) { 
     if(user._id === comment.author.id) { 
     return (
      <div> 
      <button 
       onClick={() => this.deleteComment(comment)} 
       className="btn btn-xs btn-danger"> 
       Delete 
      </button> 
      <Link 
       to={`/posts/${post._id}/comments/${comment._id}/edit`} 
       className="btn btn-xs btn-warning"> 
       Edit 
      </Link> 
      </div> 
     ) 
     } 
    } 
    } 

    renderComments() { 
    const { post } = this.props; 
    return post.comments.map((comment) => { 
     return (
     <li className="list-group-item" key={comment._id}> 
      <div> 
      {comment.text} : {comment.author.email} 
      </div> 
      {this.renderCommentsButtons(comment)} 
     </li> 
    ); 
    }); 
    } 

    deleteComment(comment) { 
    const {id} = this.props.match.params; 
    const {user, post, auth} = this.props; 

    if(!user) { 
     return (<div></div>); 
    } 

    if(auth) { 
     if(user._id === comment.author.id){ 
     console.log('comment_id:', comment._id, 'post_id:', post._id); 
     this.props.deleteComments(post._id, comment._id,() => { 
      this.props.history.push(`/posts/${post._id}`); 
     }); 
     } 
    } 
    } 

処置：

export function deleteComments(post_id, comment_id, cb) { 
    return function(dispatch) { 
    console.log('comment_id:', comment_id, 'post_id:', post_id); 
    axios.delete(`${ROOT_URL}/${post_id}/comments/${comment_id}`) 
     .then(() => { 
     dispatch({ 
      type: DELETE_COMMENTS, 
      payload: comment_id 
     }); 
     }) 
     .then(() => cb()) 
     .catch((error) => { 
     console.log(error); 
     }); 
    } 
} 

バックエンド：doesnの

exports.deleteComment = function(req, res, next) { 
    const query = {_id: req.params.comment_id}; 

    Comments.remove(query, function(err, comments) { 
    if(err) { 
     return next(err); 
    } else { 
     res.json(comments); 
    } 
    }); 
} 

Answer 1

.then(() => { dispatch(/* action */) })」何も約束を返さないので、.then(() => cb())は実行されていません。

ディスパッチアクションの直後にcallbackに電話をかけることができます。

axios.delete(`${ROOT_URL}/${post_id}/comments/${comment_id}`) 
    .then(() => { 
    dispatch({ /* action */}) 
    cb(); 
    }) 
    .catch((error) => { 
    console.log(error); 
    });