在vue中绑定事件是一下这种方法:javascript
v-on:click='函数名称';vue
@click = '函数名称';java
这两种写法都是正常。vue-router
可是咱们使用了 vue-router 路由时会使用 <router-link> 标签来代替 a 标签跳转。咱们在 vue-router 标签绑定 @click 事件 。函数
<router-link to="/date" @click="nav_click">最新</router-link> methods: { nav_click: function() { console.log(1) } }
却发现函数并无执行。这是怎么回事。。。 router
加 .native 修饰符就能够执行事件了。blog
<router-link to="/date" @click.native="nav_click">最新</router-link> methods: { nav_click: function() { console.log(1) } }
解释:事件
1: 由于它是自定义标签,根本就没有事件和方法,因此不触发,加个native 就是告诉vue 这个标签如今有主了 它是H5标签 能够加事件了。ip
2:父组件要想在子组件监听本身的click事件就得加native,router-link是标签啊。哪里有父组件???? 路由
群里大佬一句说明了缘由 router-link 其实就是一个封装好的 .vue 组件,因此须要 加.native修饰符才能绑定事件