Scroll to bottom while hidden

This commit is contained in:
Dan Abramov 2015-07-20 23:11:14 +03:00
parent e03e66c680
commit 31baa586b8

View File

@ -28,8 +28,13 @@ export default class LogMonitor {
};
componentWillReceiveProps(nextProps) {
if (this.props.stagedActions.length < nextProps.stagedActions.length) {
const scrollableNode = findDOMNode(this).parentElement;
const node = findDOMNode(this);
if (!node) {
this.scrollDown = true;
} else if (
this.props.stagedActions.length < nextProps.stagedActions.length
) {
const scrollableNode = node.parentElement;
const { scrollTop, offsetHeight, scrollHeight } = scrollableNode;
this.scrollDown = Math.abs(
@ -40,12 +45,14 @@ export default class LogMonitor {
}
}
componentDidUpdate(prevProps) {
if (
prevProps.stagedActions.length < this.props.stagedActions.length &&
this.scrollDown
) {
const scrollableNode = findDOMNode(this).parentElement;
componentDidUpdate() {
const node = findDOMNode(this);
if (!node) {
return;
}
if (this.scrollDown) {
const scrollableNode = node.parentElement;
const { offsetHeight, scrollHeight } = scrollableNode;
scrollableNode.scrollTop = scrollHeight - offsetHeight;
@ -88,7 +95,11 @@ export default class LogMonitor {
render() {
const elements = [];
const { skippedActions, stagedActions, computedStates, select } = this.props;
const { monitorState, skippedActions, stagedActions, computedStates, select } = this.props;
if (!monitorState.isVisible) {
return null;
}
for (let i = 0; i < stagedActions.length; i++) {
const action = stagedActions[i];
@ -106,7 +117,6 @@ export default class LogMonitor {
);
}
if (this.props.monitorState.isVisible === true) {
return (
<div style={{
fontFamily: 'monospace',
@ -158,7 +168,4 @@ export default class LogMonitor {
</div>
);
}
return false;
}
}