在react.js中使用onClick

Question

我想在每次单击按钮时添加评论，这是我的addComment功能

addComment: function(text){
            console.log('adding');
            var arr = this.state.comments;
            arr.push(text);
            this.setState({comments:arr});
            },

和我的render

render: function(){
        return(
        <div>
            <button onCLick={this.addComment.bind(null,'new')} className="button-info create">Add new</button>
            <div className="board">{
            this.state.comments.map(this.eachComment)}
            </div>
        </div>
        );
        }

整个代码在这里： https : //ghostbin.com/paste/895eb

问题是控制台中没有显示错误，并且当我单击按钮时，什么也没有发生。

谁能帮我找到错误？

Answer 1

这应该对您有帮助。 我认为我使用onCLick而不是onclick的问题https://facebook.github.io/react/docs/handling-events.html

Answer 2

您不需要绑定（this）或其他函数，而是尝试使用箭头函数（ ECMA SCRIPT箭头函数 ）来处理（_this，_self，_that，...）

addComment(text){
            console.log('adding');
            var arr = this.state.comments;
            arr.push(text);
            this.setState({comments:arr});
}

        <div>
            <button onCLick={() => addComment('new')} className="button-info create">Add new</button>
            <div className="board">{
            this.state.comments.map(this.eachComment)}
            </div>
        </div>

Answer 3

应该是onClick而不是onCLick。

<button onClick={this.addComment.bind(null,'new')} className="button-info create">Add new</button>

这是解决方案： https : //jsfiddle.net/jayesh24/td1v0kh4/