我在一个组件中有一个函数，当页面完全加载时，它需要加载一些变量。当你手动重新加载页面时，它似乎工作得很好，但是一旦你使用NavLink导航到页面，代码就不能运行了，因为页面没有正确地重新加载。我试过使用<BrowserRouter forceRefresh={true}>，但是它似乎什么都不做。
我需要知道的是如何通过NavLink在路由改变时重新加载页面。

// App.js
function App() {
  return (
    <BrowserRouter forceRefresh={true}>
      <Routes>
        <Route path="/" element={<Homepage />} exact/>
        <Route path="/page2" element={<Page2/>} exact/>
      </Routes>
    </BrowserRouter>
  );
}

我尝试过在页面中添加额外的钩子，以便在加载时重新加载，但这只是将其发送到无限加载循环中。
我尝试过的每一个其他解决方案要么过时，要么做加载循环，要么什么都不做。