How to update state of parent's parent component in react?

Question

I'm playing around with fb's tutorial on comment box. Let's imagine I've added functionality to delete comments, so I will have something like this in Comment component -

onClick={this.handleCommentDelete}

How do I trigger change of the state of the commentBox parent component without propagating callback throughout commentList component and then to comment component?

<commentBox>
  <commentList>
    <comment>

Answer 1

I am using PubSub pattern to communicate between components. In commentBox:

componentDidMount: function() {
    PubSub.subscribe("COMMENT_DELETED", function( msg, data ){
        console.log( data ); //logs "commentId"
    });
}

In handleCommentDelete:

PubSub.publish("COMMENT_DELETED", {commentId: commentId});

For PubSub I am using this library (but there are others of course): https://www.npmjs.com/package/pubsub-js .