title: tabs are displaying in drawer but switch not happening
body: <ul>
  <li>I am new to material ui.</li>
  <li>when you click advanced sports search a drawer opens up.</li>
  <li>i am trying to implement tabs in the drawer, but when I click the tab two in the drawer its closing.</li>
  <li>actually it should switch between tabs.</li>
  <li>its working on the intial page.</li>
  <li>so I debugged the handleChange method its working fine for inital page and printing console --->    console.log("switch tabs inital page--->");</li>
  <li>where as when I debug drawer tabs its  printing console but not switching tabs--->     console.log("switch tabs drager ui--->");</li>
  <li>can you tell me how to fix it.</li>
  <li>providing my code snippet below.</li>
  </ul>
  
  <p><a href="https://codesandbox.io/s/1qlpxx34v3" rel="nofollow noreferrer">https://codesandbox.io/s/1qlpxx34v3</a></p>
  
  <pre><code> handleChange = (event, value) =&gt; {
      console.log("switch tabs drager ui---&gt;");
      this.setState({ value });
    };
  
  
    &lt;Tabs
              value={value}
              onChange={this.handleChange}
              scrollable
              scrollButtons="on"
              indicatorColor="primary"
              textColor="primary"
            &gt;
              &lt;Tab label="Item One" icon={&lt;PhoneIcon /&gt;} /&gt;
              &lt;Tab label="Item Two" icon={&lt;FavoriteIcon /&gt;} /&gt;
  
            &lt;/Tabs&gt;
  </code></pre>