我正在try 向<router-link>组件的click事件添加一个自定义处理程序InlineButtonClickHandler,以便可以发出一个自定义appSidebarInlineButtonClick事件.

但是,我的代码不起作用.我做错了什么?

<template>
   <router-link :to="to" @click="InlineButtonClickHandler">
     {{ name }}
   </router-link>
</template>

<script type="text/babel">
export default {
  props: {
    to: { type: Object, required: true },
    name: { type: String, required: true }
  },
  methods: {
    InlineButtonClickHandler(event) {
      this.$emit('appSidebarInlineButtonClick');
    }
  }
} 
</script>

推荐答案

您需要添加.native modifier:

<router-link
    :to="to"
    @click.native="InlineButtonClickHandler"
>
    {{name}}
</router-link>

这将侦听router-link组件根元素的本机单击事件.

Vue.js相关问答推荐

如何用其他组件编译Vue模板?

从组件中检索 Shopware CMS 编辑器中的自定义实体数据

Vue 和 Nuxt 之间生命周期钩子的不同行为

Nuxt.js 中的开发工具样式编辑问题

运行vue-cli-service build --watch时没有 CSS 文件

如何在 vue.js 中删除类

在按键 vuejs 中只允许数字和一个小数点后 2 位限制

Vue 3 如何获取有关 $children 的信息

使用 azure devops 发布管道部署 Vue.js 应用程序

此 set-cookie 已被阻止,因为它具有 samesite=lax

如何从 v-for 创建的对象中绑定多个类?

如何将 git hash 添加到 Vue.js 组件

用于本地编辑的 Vuex 克隆对象

使用 Spring Boot(VueJS 和 Axios 前端)禁止发布 403 帖子

来自 Vue.js 的 ESLint 插件的消息中的LHS是什么意思?

$emit 不会触发子事件

IOS在输入焦点上显示键盘

您正在运行 Vue 的 esm-bundler 构建

如何在布局中使用组件?

居中 v-toolbar-title