当在反应路线中移动到下一个路线时，下一个路线光标位置与前一个路线相同或有些相似

Question

我现在一直在使用react-router。我在导航到新路线时遇到了这个问题。我有以下路线

 <Router history={ history } >
        <Route component={ Context } dataStore={ dataStore } >
            <Route path="/" component={ MainApp }></Route>
            <Route path="/search" component={ SearchPage }></Route>
            <Route path="/:pageUrl" component={ LandingPage }></Route>
        </Route>
    </Router>

一切都很完美。但... 我在搜索页面的底部中有一个链接，它将导航回'/'即主页。

<Link to="/"><img src="/static/images/el/app-logo.png" alt="" /></Link>

现在的问题是，它确实导航到主页，但页面光标位置与上一页相同。我需要解决这个问题，并将其视为实际的重定向发生，并且页面应该滚动到顶部。（从任何其他状态返回是有意义的，但即使对于第一次重定向，页面位置的变化看起来很难看。）为此而努力现在......我可以使用<a href="/">，但这似乎实际上是重定向和刷新页面。我想像SPA一样坚持反应路线的行为。那里有什么帮助吗？ 谢谢你的到来。

Answer 1

您可以使用scroll-behavior或use-scroll-behavior。