javascript - 什么会导致滚动到顶部？

问题描述

React 中的页面总是在history导航时滚动到顶部。我无法弄清楚导致滚动到顶部的原因。

没有window.scrollTo()这样做的
没有.focus()事件关注更高的元素并移动滚动位置
大型 React 组件不会卸载，这会导致页面变短，从而移动滚动位置

那么还有什么可以导致document.documentElement.scrollTop设置为0？

标签： javascriptreactjsscroll

过渡中是否涉及任何后备屏幕，可能是具有最小高度的加载/中间帧..您可以使用提到的React Router v4 - 在切换组件时保持滚动位置

function buttonClick() {
    document.getElementById("myDiv").classList.add("reduceHeight");
    setTimeout(()=>document.getElementById("myDiv").classList.remove("reduceHeight"),2000);
  }

#myDiv {
  border: 1px solid black;
  width: 100vw;
  height: 200vh;
  overflow: scroll;
}
#myDiv.reduceHeight {
  width: 80vw;
  height: 90vh;
}
button {
  position: fixed;
  top:100px;
  right:100px;
  z-index:100;
  width:200px;
}

<!DOCTYPE html>
<html>
<body >
<div id="myDiv">
  Scroll and Click the Simulate Button
  
</div>

<button onClick="buttonClick()">Simulate intermediate!</button>
</body>
</html>

javascript - 什么会导致滚动到顶部？

问题描述

解决方案

推荐阅读