Reactjs SPA application - everything as a component (performance and practice)

I see that the reaction fits well when you want to “detail” the small parts of your application, but I'm not sure about creating a full-fledged component application, say, SPA.

In my example, I have one page with a menu and a place for content, which are also different.

The way I decided to decide is to build a menu component and its rendering method. I’ll check which option was selected and display it in this place of content, it’s nothing but the case of switching inside the rendering method (it smells, but it’s easy to fix)

var MenuComponent = React.createClass({
  getInitialState: function() {
    return { selectedPage: '' }
  },
  handleMenuClick: function(e) {
    this.setState({ selectedPage: e.target.attributes['data-page'].value});
  },
  render: function() {
    return (
      <div className='main'>
        <ul class='menu'>
          <li><button onClick={this.handleMenuClick} data-page='applicantList'>Applicant List</button></li>
          <li><button onClick={this.handleMenuClick} data-page='applicantForm'>Applicant Form</button></li>
        </ul>
        <div className='content'>
          {function() { 
            switch(this.state.selectedPage) {
              case 'applicantList':
                return <ApplicantList />
              case 'applicantForm':
                return <ApplicantForm />
              default:
                return <h1>Select a Page</h1>
            };
          }.bind(this)()}
        </div>
      </div>
    );
  }
});

, . , , , ( ).