title: How to determine elements scroll position in React
body: <p>I am trying to implement an infinite scroll in my chat widget. I have a <code>ref</code> setup for chat body's <code>container</code> like this:</p>
  
  <pre><code>const containerNode = ReactDOM.findDOMNode(this.refs.container)
  </code></pre>
  
  <p>I also already setup an event listener that handle's the scroll:</p>
  
  <pre><code>containerNode.addEventListener('scroll', this.handleScroll);
  </code></pre>
  
  <p>I am now trying to find out how to implement the use case where before i can scroll up, it would make an ajax call.</p>
  
  <pre><code>handleScroll() {
      console.log("make an ajax call before it scrolls all the way up")
      if (some_conditon){
        //then load more!
      }
    }
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/xkoqv.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/xkoqv.png" alt="enter image description here"></a></p>