我有一张需要SEO的卡片,我需要在标题上放置nuxt链接,但整个卡片必须可通过以下方法单击:
<template>
<div @click.prevent="clickit(item)" >
<img class="background" :src="item.backgroundImage" />
<nuxt-link
:to="'/road/' + item.id"
>{{ item.text }}</nuxt-link>
<img class="mask" :src="item.backgroundMask" />
</div>
</template>
<script>
export default {
props: {
item: {
type: Object,
default: () => {}
}
},
methods: {
clickit(item) {
this.$router.push({
path: "/road/" + item.id
});
}
}
};
</script>
所以我确实喜欢这样,但问题是,当我仅单击标题时,它会触发两个事件。有没有办法防止nuxt链接中出现默认设置?
我已经找到解决方法了:
<nuxt-link
:to="'/road/' + item.id"
@click.native="fuga"
event
class="ititle"
>{{road.name}}</nuxt-link>