[Vuejs]-<v-data-table <a href="method"></a> calling automatically. How to prevent calling default without click?

by

0👍

This implementation will not make it call the testMethod, until the user click on the link! Still it won’t work because of the use of href!

You don’t call the method with an href on the "a" tag. Instead, just add an @click on the "a" tag and this will make it call the test method when the name is clicked. Also, you don’t have to use an "a" tag, you can use any other element and add the @click to it.

Update your template as follows

<template>
    <v-data-table :items="testData" :headers="headers">
        <template slot="item.name" slot-scope="{ item }">
            <a @click="testMethod">{{item.name}}</a>
        </template>
    </v-data-table>
</template>

Good luck.

0👍

Thanks for the quick response. The issue is fixed, I used @click.stop="testMethod" along with href="routing to another page".
<a href="routing to another page" @click.stop="testMethod()">

Leave a comment