Search code examples
javascriptvue.jsvue-clivue-cli-3

How to use router-link with event?


I want to pass the information to another page.When I was just testing without using route I was able to pass information from one component to anther but when I implemented route like this, It navigating to other component when click event I am not getting information to another page. The code is below which has a issue, sorry I cannot post all of the code because of code is too lengthy. Can anyone help me please?

<router-link  @click.native="$emit('viewDetails', model)" to="/modelDetails">
view details
</router-link>

Solution

  • If you want both the emission and the navigation to occur, you probably want to use a regular <a> and bind it to a method on the component that handles both of these actions:

    <a @click="myFunc(model)">View details</a>

    methods: {
      myFunc(model) {
        this.$emit('viewDetails', model);
        this.$router.push('/modelDetails');
      }