javascript - ReactJs 添加事件类到按钮

Question

我有五个动态创建的按钮。我的目标是:当单击任何按钮向其添加事件类时，当然，如果任何其他按钮具有该事件类，则将其删除。我怎样才能实现这一目标？

<div>
    {buttons.map(function (name, index) {
        return <input type="button" value={name} onClick={someFunct} key={ name }/>;
   })}
</div>

Answer 1

您需要向组件引入状态并在 onClick 事件处理程序中设置它。例如渲染方法的输出:

<div>
    {buttons.map(function (name, index) {
        return <input
                 type="button"
                 className={this.state.active === name ? 'active' : ''}
                 value={name}
                 onClick={() => this.someFunct(name)}
                 key={ name } />;
   })}
</div>

事件处理程序(元素方法):

someFunct(name) {
    this.setState({ active: name })
}