react bootstrap hide toggle menu when scrolling down

1  import React, { Component } from 'react';
2
3   class App extends Component {
4
5   constructor(props) {
6    super(props);
7
8      this.state = {  scrollBackground: 'nav-bg' };
9      this.handleScroll = this.handleScroll.bind(this);
10   }
11
12
13   handleScroll(){
14      this.setState ({
15         scrollBackground: !this.state.scrollBackground
16       })
17    }
18
19 render() {
20 const scrollBg = this.scrollBackground ? 'nav-bg scrolling' : 'nav-bg';
21
22 return (
23   <div>
24
25       <Navbar inverse toggleable className={this.state.scrollBackground} 
26                                  onScroll={this.handleScroll}>
27        ...
28      </Navbar>
29
30    </div>
31   );
32  }
33}
34
35export default App;