如何防止浏览器滚动到渲染顶部

Question

如何防止浏览器滚动到渲染顶部？可以在https://www.gatsbyjs.org/或https://reactjs.org/上进行复制，方法是通过节流的网络连接转到网站并在页面呈现之前向下滚动。

禁用JS时不会发生这种情况。我相信这是盖茨比唯一的问题。

Answer 1

这最终是Gatsby中的错误，可以在https://github.com/gatsbyjs/gatsby/issues/6392#issuecomment-404444341处进行跟踪。

一种解决方法是在安装组件之前禁用滚动，然后重新启用它。可以通过以下样式更改来完成：

// styles.css
body {
  overflow: hidden;
}

// Component.js
componentDidMount () {
  document.body.style.overflow = 'auto'
}

Answer 2

正如Ben所说：尝试在链接处理程序上添加preventDefault()。

React.js: Stop render from scrolling to top of page