john_ryan john_ryan -4 years ago 571
HTML Question

React scrollTop not working

I have a react component with a scrollable div I'm trying to get the div to scroll to the bottom after it mounts:

componentDidUpdate() {
var scrollNode = ReactDOM.findDOMNode(this.scrollElement);
scrollNode.scrollTop = scrollNode.scrollHeight;
}


the scrollNode exists and reflects the correct div however, the value of scrollTop is never changed (it remains 0 even if i set it to some arbitrary number) and the scroll doesn't occur.

UPDATE:
Here's an example:
https://codepen.io/johnryan1/pen/BWoeKQ

Answer Source

You need to set a height to your container in your css. For example

.list
   height: 100px
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download