在反应中滚动到顶部 - Javascript

在许多 Web 应用程序中，我们需要在页面上滚动到顶部。在 React 应用程序中，我们可以使用以下代码段轻松滚动到顶部：

import React, { useRef } from "react";

function scrollToTop() {
  window.scrollTo({
    top: 0,
    behavior: "smooth"
  });
}

function App() {
  const buttonRef = useRef();

  return (
    <>
      <button onClick={scrollToTop} ref={buttonRef}>
        Scroll to Top
      </button>
      {/* 页面的其余部分 */}
    </>
  );
}

export default App;

上面的代码使用 window.scrollTo 函数将页面滚动到顶部。我们还可以指定 behavior 选项，使滚动过程变得平滑。

当用户单击按钮时，我们将调用 scrollToTop 函数，并且该函数将使用 window.scrollTo 处理程序滚动到页面的顶部。

此外，我们还使用了 useRef 钩子来获取按钮的引用。这使我们能够根据需要修改或访问该按钮的属性。

现在，您已经知道了在 React 中滚动到页面顶部的方法。在您的下一个 React 项目中使用它，并确保您的用户能够轻松地浏览您的应用程序。