reactjs - props.history.push('/') 没有转到页面顶部（需要功能组件）

Question

我正在使用 React 构建一个网站，用户单击一个按钮进行注册。在该按钮的回调中，我使用props.history.push('/')重定向到主页。

在注册页面中，他们必须稍微向下滚动，并且他们在页面上的位置会延续到主页。还有另一种重定向到页面顶部的方法吗？

标签： reactjs

Answer 1

下面的解决方案示例显示了如何使用它。这将使窗口在整个应用程序中自动滚动到顶部。信用未知 - 我从这里的某个地方得到它。

反应组件 - ScrollToTop：

import { useEffect } from "react";
import { withRouter } from "react-router-dom";

function ScrollToTop({ history }) {
    useEffect(() => {
        const unlisten = history.listen(() => {
            window.scrollTo(0, 0);
        });
        return () => {
            unlisten();
        };
    }, [history]);

    return null;
}

export default withRouter(ScrollToTop);

照片显示了我如何在我的应用程序中使用它：