title: How can I change tabs in react-bootstrap using a button?
body: <p>How can I change a tab by a click of a button using React/React-Bootstrap? For example, to click on a button and it let me go to the tab selected.
  Code below: </p>
  
  <pre><code>import React, {Component} from 'react'
  import { Tabs, Tab } from 'react-bootstrap';
  
  export default class TabPuzzle extends Component {
  
  constructor(props) {
    super(props);
    this.state = {
      key: 2
    };
   this.handleSelect = this.handleSelect.bind(this)
  }
  handleSelect(key) {
    alert('selected ' + key);
    this.setState({key});
  }
  render () {
    return (
      &lt;div&gt;
        &lt;Tabs activeKey={this.state.key} onSelect={this.handleSelect} 
         id="controlled-tab-example"&gt;
                &lt;Tab eventKey={1} title="Tab 1"&gt; Tab Content 1 &lt;/Tab&gt;
                &lt;Tab eventKey={2} title="Tab 2"&gt; Tab Content 2 &lt;/Tab&gt;
                &lt;Tab eventKey={3} title="Tab 3"&gt; Tab Content 3 &lt;/Tab&gt;
        &lt;/Tabs&gt;
              &lt;button onClick={()=&gt;this.handleSelect("3")}&gt;Go to tab 3&lt;/button&gt; 
      &lt;/div&gt;
    )
   }
  }
  </code></pre>