在 react-router-dom 页面更改时滚动到顶部

Question

我正在react-router-dom用于实现我的 reactjs 应用程序的路由！但是我对此有一个问题，在该问题中我找不到任何可在页面更改时滚动到顶部的有效解决方案。有谁能够帮助我？？？

这是我的路由代码段：

    <BrowserRouter  basename={basename}> 
          <Switch>
                    <MobilePage hasNav navType="primary" exact path={`/restaurant`} component={VendorList} />
                    <MobilePage hasNav navType="primary" path={`/restaurant/:vendorCode`} component={VendorDetails} /> 
          </Switch>
    </BrowserRouter>

Answer 1

我目前正在使用 react-router-dom v5（我发现的这些解决方案中的大多数都适用于 v4），但我很惊讶没有找到在转换中将页面加载到顶部的解决方案。

解决我的问题的是安装react-router-scroll-top并将包装器放在这样的位置：

const App = () => (
  <Router>
    <ScrollToTop>
      <App/>
    </ScrollToTop>
  </Router>
)

一切都按预期进行。