reactjs scrollTop

2024年3月5日 216次阅读 来源: winteraq

问题1：

单页应用开发时，当在A页面滚动滚动条后，点击进入B页面，滚动条保持在A页面的滚动位置。

目标：

同级路由切换时，滚动条回滚到页面顶端。

解决方案：

//在componentDidMount周期添加scrollTo()

class Home extends Component{
    componentDidMount(){
        window.scrollTo(0, 0);
    }
}

问题2：

在同一页面中点击回到顶部button，实现页面回到顶部.

目标：

onClick时，页面回到顶部。

解决方案：

<div onClick={() => {document.documentElement.scrollTop = 0;}}></div>
    原文作者：winteraq
    原文地址: https://segmentfault.com/a/1190000017439805
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞