Edit in JSFiddle

var CommentApp = React.createClass({

    getInitialState: function() {
        return {
            comments: []
        }
    },
    
    render: function() {
        return (
            <div>
                <NewComment
                    onAction={this.onAction} />
                <CommentList
                    comments={this.state.comments} />
            </div>
        );
    },
    
    onAction: function(payload){
        switch(payload.action){
          case "SUBMIT_NEW_COMMENT":
            this._onSubmitNewComment(payload.value);
            break;
          default:
            console.warn("Action: '" + payload.action + "' was not handled.");
        }
    },
    
    _onSubmitNewComment: function(comment) {
        var comments = this.state.comments;
        comments.push(comment);
        this.setState({
            comments: comments
        });
    }
});

var NewComment = React.createClass({

    getInitialState: function(){
        return {
            comment: "",
            author: ""
        };
    },
    
    render: function() {
        return (
            <div>
                <input 
                    ref="author"
                    placeholder="Author" 
                    value={this.state.author}
                    onChange={this._onAuthorChange}/> 
                <input  
                    ref="comment"
                    placeholder="Comment" 
                    value={this.state.comment} 
                    onChange={this._onCommentChange}/> 
                <button onClick={this._onCommentSubmit}>Submit</button>
            </div>        
        );        
    },
    
    _onCommentChange: function() {
        this.setState({
            comment: React.findDOMNode(this.refs.comment).value
        });
    },
    
    _onAuthorChange: function() {
        this.setState({
            author: React.findDOMNode(this.refs.author).value
        });
    },
    
    _onCommentSubmit: function() {
        var payload = {
            action: "SUBMIT_NEW_COMMENT",
            value: {
                comment: this.state.comment,
                author: this.state.author
            }
        }
        this.props.onAction(payload);
        this.setState(this.getInitialState())
    }
});
 
 
var CommentList = React.createClass({
    
    render: function(){
        var listNodes = this.props.comments.map(function(comment){
            return (
                <div>
                    <h3>{comment.author}</h3>
                    <p>{comment.comment}</p>
                </div>
            );
        });
        
        return (
            <div>
                {listNodes}
            </div>
        );
    }   
});

React.render(<CommentApp name="World" />, document.getElementById('comment-app'));

<script src="https://facebook.github.io/react/js/jsfiddle-integration.js"></script>

<div id="comment-app">
    <!-- This element's contents will be replaced with your component. -->
</div>