Javascript 单击同一页面链接时如何在 React 中刷新同一页面

发布于04月24日

有没有一种方法，每次你在Reaction中点击一个链接就会刷新页面？即使您所在的页面与链接指向的页面相同，用户也可以刷新该页面.

例如，我有一个图标，它位于主页的"/"处，该图标也位于页脚.当我在主页的底部时，我点击它不会刷新页面，所以我仍然在页面的底部.

每次转到另一个选项卡时，我都会使用此代码来恢复滚动位置


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

export default function ScrollToTop() {
  const { pathname } = useLocation();

  useEffect(() => {
    window.scrollTo(0, 0);
  }, [pathname]);

  return null;
}

但这只是在换页时恢复了主页位置.

这是我的代码:

function App() {

  return (
    <Router>
        <ScrollToTop />
      <div className="App">
        <Navbar></Navbar>
      <Routes>
      <Route exact path='/' element={<Home></Home>} ></Route>
      <Route  path='/movies/:id' element={<MovieDetails ></MovieDetails>} ></Route>
      <Route  path='/user' element={<UserPage></UserPage>} ></Route>
      </Routes>
      <Footer></Footer>
      </div>
    </Router>

  );
}

export default App;

import { BrowserRouter as Router, Route, Routes } from "react-router-dom"; function App() { return ( <Router forceRefresh={true}> <ScrollToTop /> <div className="App"> <Navbar /> <Routes> <Route exact path="/" element={<Home />} /> <Route path="/movies/:id" element={<MovieDetails />} /> <Route path="/user" element={<UserPage />} /> </Routes> <Footer /> </div> </Router> ); } export default App;

Javascript 单击同一页面链接时如何在 React 中刷新同一页面

推荐答案

Javascript相关问答推荐

有没有方法在Angular中的bowser选项卡之间移动HTML？

如何在alpinejs中显示dev中x-for的元素

JavaScript：循环访问不断变化的数组中的元素

为什么在集内和集外会产生不同的promise 状态(使用Promise.race)？

React存档iframe点击行为

使用axios.获取实时服务器时的404响应

在JavaScript中声明自定义内置元素不起作用

为什么当我解析一个promise时，输出处于挂起状态？

如何为我的astro页面中的相同组件自动创建不同的内容？

给定一个凸多边形作为一组边，如何根据到最近边的距离填充里面的区域

在我的html表单中的用户输入没有被传送到我的google表单中

是什么导致了这种奇怪的水平间距错误(？)当通过JavaScript将列表项元素追加到无序列表时，是否在按钮之间？

在Java中寻找三次Bezier曲线上的点及其Angular

Webpack在导入前混淆文件名

OpenAI转录API错误请求

删除加载页面时不存在的元素(JavaScript)

警告框不显示包含HTML输入字段的总和

图表4-堆叠线和条形图之间的填充区域

我正在试着做一个TicTacToe Ai来和我玩.但是，我试着在第一个方块被点击时出现一个X，然后在第二个方块之后出现一个O

本地损坏的Java脚本