javascript - 如何防止浏览器在渲染时滚动到顶部

Question

如何防止浏览器在渲染时滚动到顶部？这可以在 https://www.gatsbyjs.org/ 复制或 https://reactjs.org/通过使用受限网络连接访问网站并在页面呈现之前向下滚动。

禁用 JS 时不会发生这种情况。我相信这是 Gatsby 独有的问题。

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'
}