How to get React Component link to change my class using classList?

Question

I created React Component using the following code. In this, I create a tab and add a class and save its link in the global namespace interface for further processing.

var TabBody = React.createClass({
  getInitialState: function() {
    return {
      class: 'tabBody tab activeTab'
    }
  },
  render: function() {
    Interfaces.tabBody = this;
    tabSelectionInfo.tabBody = this;
    return (
      React.createElement('div', {
          className: this.state.class,
          onClick: handleTabClick
        },
        React.createElement('span', {}, "Body"))
    );
  }
});

using the following function: To add a class to the above component, the console displays an undefined error. how to maintain redundancy of this component, then to change its class.

handleTabClick = function() {
  Interfaces.tabBody.classList.add('tabPreviewComplete');
}

Answer 1

, "", tabBody tab activeTab '

className: this.state.class,

setState() . "Interface.tabBody", , setState(), ,

Interface.tabBody.setState({class: 'tabBody tab activeTab disabled'});

, .

handleclick() ,

handleTabClick = function() {
  this.setState({class: 'tabBody tab activeTab disabled'});
}

setState(), React .

Answer 2

, this , DOM. DOM ( React DOM), , :

React.createElement('div', {
  ref: 'tabBody'

this.refs.tabBody

. handleTabClick, :

React.createElement('div', {
  ref: 'tabBody'
  onClick: e => this.props.handleTabClick(e, this.refs.tabBody)

:

handleTabClick = function(e, tabBody) {
    tabBody.classList.add('tabPreviewComplete');
}

, , , .

Fiddle: http://jsfiddle.net/ferahl/dpvb1h3y/