Simple React Toggle On/Off with Multiple Components

gistfile1.txt

var Component1 = React.createClass({
  render: function() {
    var txt = this.props.txt;
    return(
      <div>
        <button onClick={this.handleClick().bind(this)}>
          Toggle {txt}
        </button>
      </div>
    );  
  },
  
  handleClick: function() {
    return function() {
      this.props.toggled();
    }
  }
});

var Component2 = React.createClass({
  render: function() {
    return(
      <div>
        Component2
        <Component1 
         toggled={this.props.toggled}
         txt={this.props.txt}
        />
      </div>
    );
  }
});


var App = React.createClass({
  getInitialState: function() {
    return {
      toggled: false,
      txt: ''
    }
  },
  
  render: function() {
    return(
     <div>
       <Component2 
         toggled={this.handleToggle().bind(this)}
         txt={this.state.txt}
        />
     </div>
    );  
  },
  
  handleToggle:function() {
    return function() {
      var txt = this.state.toggled === true 
      ? 'On'
      : 'Off';
      this.setState({
         toggled: !this.state.toggled,
         txt: txt
      })
    }
  }
  
});

React.render(
  <App/>,
  document.getElementById('mount')
);