Javascript ReactJs：如何在循环中将函数作为prop发送

有人能告诉我如何在循环中发送函数吗？如果我直接发送到循环，我会出错。是否仍要在循环中发送函数并从函数中调用它

我在CommentListItem.js中调用了subcentListItem

<SubCommentListItem 
                            key={subcomment.id} 
                            data={subcomment} 
                            parentid={commentID} 
                            updateComment={(comment) => this.updateComment()}
                            user={user} postid={postid} 
                            />

试试这个

{this.state.subcomments.map(function (subcomment, i) {
      return (
              <SubCommentListItem key={subcomment.id} 
                subcomment= {this.state.subcomments} 
                data={subcomment} parentid={commentID} 
                user={user} postid={postid}
                yourfunctionname={() => this.props.yourfunction()}
               />
              );
 })}

{this.state.subcents.map（函数（subcent，i）{
返回(
this.props.yourfunction（）}
/>
);
})}

您需要对代码进行一些更改

首先，更新功能。让我们把它变成一个箭头函数，这样您就不必绑定它了：

updateComment = comment => {
    this.setState({ showForm:false })
    this.props.updateComment(comment)
}

现在只需在您的道具中发送对它的引用：

<SubCommentListItem
    key={subcomment.id}
    data={subcomment}
    parentid={commentID}
    updateComment={props.updateComment}
    user={user} postid={postid}
/>

此语法与其父组件中的语法相同

此外，以下代码：

{this.state.showForm ? (<CommentForm updateComment={this.updateComment} class={'subCommentFormBox'} parentid={this.state.parentid} postid={postid} user={user} />):(<div></div>)}

{this.state.showForm？（）：（）}

可以缩短为：

{this.state.showForm && <CommentForm updateComment={this.updateComment} class='subCommentFormBox' parentid={this.state.parentid} postid={postid} user={user} />}

{this.state.showForm&&}

---

我建议在React中使用

className

，而不是

class

要支持函数，所以我可以调用它。有两种方法（好几种，但这里有两种方法），你应该将函数设为lambda，即将“function（subcent，I）”替换为“（subcent，I）=>”，否则为“this”将引用此.state.subcents，或者您可以将“function（subcent，i）”替换为“function（subcent，i，subcents）”，并将“this.state.subcents”替换为“subcents”，映射第三个参数是数组本身。为了完整性，让我补充一点，另一种方法是在类中定义一个方法commentsMap（subcent，i）。。。然后在您的构造函数中执行this.commentsMap=this.commentsMap.bind（this），那么“this”将始终引用您创建的类的实例，您可以执行“this.state.subcomments.map（this.commentMap）”否它以那种方式不工作“不工作”是什么意思？我收到此错误警告：无法对未安装的组件执行React状态更新。这是一个no-op，但它表示应用程序中存在内存泄漏。要修复此问题，请取消componentWillUnmount方法中的所有订阅和异步任务。在commentForm（位于SubcentListItem.js:58）中，它表示TypeError:无法读取未定义的属性'updateComment'。这意味着

this.props

未定义，您能否向我展示使用它的组件（通过编辑您的问题）检查此图像Lol，

this

未定义。。。有趣的给我看完整的类代码NerverMind，你使用了一个无状态组件，却忘了告诉我们。只需使用

props.updateComment

并确保在函数中收到

props

变量

this.props.updateComment(yourComment)

{this.state.showForm ? (<CommentForm updateComment={this.updateComment} class={'subCommentFormBox'} parentid={this.state.parentid} postid={postid} user={user} />):(<div></div>)}

{this.state.showForm && <CommentForm updateComment={this.updateComment} class='subCommentFormBox' parentid={this.state.parentid} postid={postid} user={user} />}