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