为每个可以选择的项目保留一个单独的
state变量,并使用
classnames库有条件地操作类作为facebook
recommends.
编辑：好的,您已经提到一次只能选择1个元素,这意味着我们只需要存储选择了哪一个(我将使用所选项目的ID).而且我注意到你的代码中有一个拼写错误,你需要在声明一个组件时链接该函数,而不是调用它
(注意handleClick不再包含()).
现在我们将使用partial application – bind方法将元素的id和事件一起传递给handleClick处理程序：
正如我所说,我们希望将所选项目的id存储在状态中,因此handleClick可能如下所示：
handleClick(id,event){
this.setState({selectedItemId: id})
...
}
现在我们需要将selectedItemId传递给SportItem实例,以便他们知道当前的选择：< SportItem selectedItemId = {selectedItemId} ....另外,不要忘记将onClick = {this.handleClick}回调附加到它需要的位置,调用哪个将触发父级中状态的更改：
the div will always have 'foo' class but 'myClass' will be added only if this is the element that's currently selected}>
