Nuxt-link on pan而不是click？

Question

传统的nuxt-link通过单击链接来导航您的页面。我想知道我是否可以通过pan触发相同的跨页面路由操作，而不是单击链接！

如下所示(我使用的是hammerjs)：

sliderManager.on("pan", function(e) {
    // trigger nuxt-link click and routes me to another page
})

典型的nuxt-link

<nuxt-link to="/about">About</nuxt-link>

从本质上讲，我希望通过滑动导航到我的about页面。

Answer 1

Nuxt将Vue Router实例公开为$router，因此您可以使用$router.push()导航到链接的to。在<nuxt-link>上使用ref从您的回调访问链接。

<template>
  <nuxt-link ref="myLink" to="/about">About</nuxt-link>
</template>

<script>
export default {
  async mounted() {
    await this.$nextTick()

    //...

    sliderManager.on("pan", () => {
      sliderManager.off("pan")

      this.$router.push("/about")

      // OR
      this.$router.push(this.$refs.myLink.to)
    })
  }
})
</script>