在 Vue 中点击路由器链接的激活方法

A.J*_*A.J 10 javascript vue.js vue-router

我正在处理 Chrome 扩展程序的帐户删除,我有以下按钮:

<button @click="remove" id="button_remove" class="btn btn-default" style="float: right;">Remove Account</button>
Run Code Online (Sandbox Code Playgroud)

JS

methods:{
    remove(event){
       app.removeAccountData(url,apikey);
    }
},
Run Code Online (Sandbox Code Playgroud)

我也有这个router-link

methods:{
    remove(event){
       app.removeAccountData(url,apikey);
    }
},
Run Code Online (Sandbox Code Playgroud)

有没有办法使用router-linkwithJS函数?

ton*_*y19 19

由于<router-link>是围绕 的组件包装器<a>,我们需要使用.native修饰符来正确接收事件:

<router-link @click.native="remove" to="/remove">Remove</router-link>
Run Code Online (Sandbox Code Playgroud)

演示

  • 这似乎适用于 Vue 3 和 Vue Router 4 &lt;RouterLink :to="{ name: 'RemovedWId' }" @click="remove" /&gt; (2认同)
  • [演示](https://stackblitz.com/edit/vue3-click-handler-on-router-link-dzsbsc?file=src/App.vue) &lt;RouterLink to="/about" @click="this. sayHello()"&gt; yolo&lt;/RouterLink&gt; (2认同)