Router-link events such as @click and @mouseover will not be triggered

Router-link prevents click and mouseover events from being triggered.

According to the principles of communication between parent and child components in Vue2.0 official documentation, the parent component passes data to the child component through prop, and the child component triggers events to the parent component. But if the parent component wants to listen for its own click on the child component, it needs to add the native modifier.

2. Inconsistent to and Click event trigger timing between router-link development environment and online environment

<router-link to="pathName" @click.native="handleClick1"/>
Copy the code

Development environment: In any case click fires first and then jumps

Online environment: After a router.push(pathName) jump, a router-link jump will trigger click

The cause of this bizarre bug is unknown.

The curve solution: add the trigger event before the jump to handleClick2. The development and online environments behave the same, and both trigger before the jump

<router-link to="pathName" @click.native="handleClick1">
    <div @click="handleClick2"/>
</router-link>
Copy the code