router-link绑定事件

router-link上常规添加@click 事件是失效的,比如下面的jump() 就不能被执行


<template>
    <div id="app">

        <h1>hello app!</h1>
        <p>
            <router-link to='/page1' >page1</router-link>
            <router-link to='page2'  @click='jump' >page2</router-link>

        </p>
        <router-view></router-view>
    </div>
</template>

根据Vue2.0官方文档关于父子组件通讯的原则,父组件通过prop传递数据给子组件,子组件触发事件给父组件。但父组件想在子组件上监听自己的click的话,需要加上native修饰符。

所以如果在想要在router-link上添加事件的话需要@click.native这样写

 <router-link to='page2'  @click.native='jump' >page2</router-link>

猜你喜欢

转载自blog.csdn.net/jx950915/article/details/80117675