javascript - 如何使用Reactjs向每个 ListView 项添加按钮？

我在每个组旁边添加了一个加入按钮，如下所示：

var publicGroupItems = publicGroups.map(group =>
            <ListItem key={group._id} global href={'/groups/' + group._id} image={group.imageUrl} title={group.name} ><button type="button" onClick={this.joinGroup(group._id)}>joinGroup</button></ListItem>)

当我单击按钮时，它会遍历每个组ID，并将当前用户添加到所有组中。

如何使用户仅添加到我单击加入的特定组中？

最佳答案

这里的问题是您的onClick

onClick={this.joinGroup(group._id)}

由于您有this.joinGroup(group._id)作为函数调用，因此甚至在单击按钮之前，每个组都会对其调用一次。

您需要引用函数而不是调用它：

onClick={this.joinGroup.bind(this, group._id)}

单击该按钮时将触发joinGroup。第一个参数是group._id的值，第二个参数是SyntheticEvent。

joinGroup: function(groupId, event) {
  //Join The Group
}

关于javascript - 如何使用Reactjs向每个 ListView 项添加按钮？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/30217793/