vue.js - Vue-router 如何返回到主页的特定部分？

Question

我目前有一个主页，其中包含许多部分，用户可以通过滚动或从导航栏菜单 1 访问这些部分。在此菜单中还有一个“加号”按钮，用于从路由器请求其他页面

所有从路由器调用的页面都有一个navbar menu-2可以从路由器调用其他页面或返回首页

一切正常...

但我希望能够从此页面返回到主页的特定部分；..

我尝试使用:

              <div class="navbar-text">
              <!-- Button trigger modal-->
              <div class="dropdown">
                  <button class="dropbtn">PLUS...</button>
                  <div class="dropdown-content">
                      <a @click="$router.push('/home#about-us')">ABOUT US</a>
                      <a @click="$router.push('/home#memberships')">MEMBERSHIPS</a>
                      <a @click="$router.push('/hoem#events')">EVENTS</a>
                      <a @click="$router.push('/home#portfolio')">PORTFOLIO</a>
                      <a @click="$router.push('/home#leaders')">LEADERS</a>
                      <a @click="$router.push('/home#contact')">CONTACT</a>
                  </div>
              </div>
          </div>

但是没办法..我总是回到首页顶部...

有什么技巧吗？感谢反馈

Answer 1

查看 Vue Router - Scroll Behavior来自文档:

When using client-side routing, we may want to scroll to top when navigating to a new route, or preserve the scrolling position of history entries just like real page reload does. vue-router allows you to achieve these and even better, allows you to completely customize the scroll behavior on route navigation.

特别是异步滚动部分之前的代码