在React中将函数传递给组件的新属性

时间:2018-12-03 21:25:15

标签: javascript reactjs jsx

嗨,我正在尝试在React中尝试几个代码段。以下代码生成“无法读取未定义的属性'removeComment'”类型错误。我已经尝试了不同的技术来将功能绑定到类,如react文档https://reactjs.org/docs/faq-functions.html中所述,但是问题仍然存在。以下是我的代码:

class Board extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            comments: ["item1", "item2", "item3"]
        }
        this.removeComment = this.removeComment.bind(this);
        this.updateComment = this.updateComment.bind(this);
    }

    removeComment = (i) => {
        console.log("Removing comment " + i)
        var arr = this.state.comments;
        arr.splice(i, 1)
        this.setState({ Comments: arr })
    }

    updateComment = (newText, i) => {
        var arr = this.state.comments;
        arr[i] = newText
        this.setState({ comments: arr })

    }

    eachComment(text, i) {
        return (<Comment key={i} index={i}
            deleteComment={this.removeComment.bind(this)}
            updateCommentText={this.updateComment.bind(this)}>{text}</Comment>)
    }

    render() {
        return (
            <div>
                {
                    this.state.comments.map(this.eachComment)
                }
            </div>
        )
    }
}

0 个答案:

没有答案