如何在ReactJS的事件中添加或删除className

对于React,我很新,我正在为从标准的js转换我的思想而挣扎。

在我的反应组件中,我有以下元素:

<div className='base-state' onClick={this.handleClick}>click here</div> 

我正在寻找的行为是点击添加一个额外的类。 我的第一个想法是试图在点击处理函数中添加类,例如

 handleClick : function(e) { <add class "click-state" here> } 

我还没有find任何类似的例子,所以我相当肯定我没有正确的思考这个问题。

任何人都可以指向正确的方向吗?

类的列表可以从组件的状态派生。 例如:

 var Component = React.createClass({ getInitialState: function() { return { clicked: false }; }, handleClick: function() { this.setState({clicked: true}); }, render: function() { var className = this.state.clicked ? 'click-state' : 'base-state'; return <div className={className} onClick={this.handleClick}>click here</div>; } }); 

调用this.setState将触发组件的重新渲染。