使用nuxt链接导航到具有哈希/锚点的页面时出现问题

JavaScript Vue.js

GilGreen

2020-03-24

我在网站导航中使用了nuxt链接,其中大多数指向首页中的散列元素/锚点,例如:

<nuxt-link
  v-else
  class="text-link"
  :to="localePath('index') + #hash"
>

如果当前在主页上,但是当我导航到其他站点时,它将完成其工作。/ about,然后单击导航栏nuxt链接(因此我想从/ about导航到/#hash或/ any-other-site#hash),我显示了nuxt错误,以检查控制台上显示“无法读取”的错误属性'offsetTop'为null”。

我在nuxt.config中的路由器配置(如果没有它,我什至无法滚动到与该元素位于同一站点中的锚定元素!):

  router: {
    scrollBehavior(to) {
      if (to.hash) {
        return window.scrollTo({ top: document.querySelector(to.hash).offsetTop + window.innerHeight, behavior: 'smooth' });
      }
      return window.scrollTo({ top: 0, behavior: 'smooth' });
      }
  },

在:to属性中,我尝试了'hash''#hash',没有任何效果。可以请任何人帮助我吗?如何导航到其他页面+ #anchor(以便滚动到该锚点?)

第3302篇《使用nuxt链接导航到具有哈希/锚点的页面时出现问题》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

0个回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android