javascript - 努克斯 : how to prevent nuxt-link goes to another page?

标签 javascript vue.js nuxt.js

我需要阻止 nuxt-link 转到另一个页面。

这是我的代码

<nuxt-link :to="item.url" data-toggle="collapse" class="nav-link" v-b-toggle="'collapse-'+index" :ref="'parent-'+index" @click.native="toggleSubMenuIcon(index)">


methods: {
    toggleSubMenuIcon(index) {
      this.$store.dispatch('layout/TOGGLE_SUBMENU_ICON', index)
    }
  }

我需要一个类似的 e.preventDefault() 来阻止浏览器访问 item.url 页面

我也尝试过

<nuxt-link :to="item.url" data-toggle="collapse" class="nav-link" v-b-toggle="'collapse-'+index" :ref="'parent-'+index" @click.native="toggleSubMenuIcon(index), event => event.preventDefault()">

没有成功。

我不会在 URL 中使用简单的“哈希”,因为我不喜欢在 URL 浏览器中打印它。

谢谢

最佳答案

尝试添加event="",它对我有用

<nuxt-link event="" :to="item.url" data-toggle="collapse" class="nav-link" v-b-toggle="'collapse-'+index" :ref="'parent-'+index" @click.native="toggleSubMenuIcon(index), event => event.preventDefault()">

关于javascript - 努克斯 : how to prevent nuxt-link goes to another page?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59885664/

相关文章:

javascript - jQuery 在新的触发之前等待函数完成

javascript - Konva js 中的线宽

javascript - 从 url react 加载 svg 图像

vue.js - 防止vue在元素之间渲染换行符

javascript - 在 Vuex/Nuxt 中绑定(bind)选择表单

vue.js - Asyncdata 与 Fetch 之间的区别

javascript复制输入文件并获取完整文件路径

docker - 将VuePress与docker和NGINX传递一起使用

javascript - 有没有办法从 Vue 组件中的声明呈现 Markdown

css - Nuxt 3 + SASS : Can't use include paths with @import and @use