title: how to toggle class on scroll event in react?
body: <p>I need to add or remove class on element if page is scrolled in react I wrote such a code to track page scroll:</p>
  
  <pre><code>export default class TestComponenet extends React.Component {
    constructor(props) {
      super(props);
      autoBind(this);
      this.state = {
        scrolled: false
      }
    }
  
    componentDidMount() {
      window.addEventListener('scroll', this.handleScroll);
    };
  
    componentWillUnmount() {
      window.removeEventListener('scroll', this.handleScroll);
    };
  
    handleScroll(event) {
      this.setState({srolled: true});
    };
  
    render() {
      return (
        &lt;div className ={scrolled ? 'scrolling' : ''}&gt;&lt;/div&gt;
      );
    }
  }
  </code></pre>
  
  <p>but I can only track scroll but I cannot toggle class dynamically.</p>