作为属性传递的绑定函数反射

Question

我想传递一个绑定的函数（参数）（有一个setState（））作为属性，但我面对这个错误，我不确定如何通过这种类型的功能。

Cannot read property 'upadateComment' of undefined 

这是index.js文件我的课段，（即具有的功能类）

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

upadateComment = (newText , i) => { 
    console.log('updating comment: ' + i); 
    var arr = this.state.comments; 
    arr[i] = newText; 
    this.setState({comments: arr}); 
} 


eachComment(text, i) { 
    return (
     <Comment        
     key={i} index={i} updateCommentText={this.upadateComment}//here is the problem 
     removeCommentText={this.removeComment}> //and here 
     {text} 
     </Comment> 
    ); 
} 

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

，这是地方调用它们（Comment.js文件）

edit =() => { 
    this.setState({editing: true}); 
} 

remove =() => { 
    this.props.removeCommentText(this.props.index); 
    console.log('removing'); 
} 

save =() => { 
    this.props.updateCommentText(this.refs.newText.value , this.props.index); 
    console.log('new Text: '); 
    this.setState({editing: false}); 
} 

Answer 1

由于eachComment是一个函数声明，它指的是错误的this上下文。我建议你把它改成arrow function。

eachComment = (text, i) => { 
    return (
     <Comment        
     key={i} index={i} updateCommentText={this.upadateComment} 
     removeCommentText={this.removeComment}> 
     {text} 
     </Comment> 
    ); 
}