问题描述
所以我有一个对象列表,每个对象都呈现在一个列表中.同时,每个列表元素都应该在点击时重定向到特定的路由:
So I have a list of objects each rendered in a list. At the same time, each list element should redirect to a specific route on click:
<template>
<b-container>
<h1 v-if="error">{{error}}</h1>
<b-table
sort-icon-left
borderless
outlined
v-else-if="coins"
@row-clicked="coinRowClickHandler"
selectable
small
:items="coins"
:fields="fields">
<template #cell(coin)="data">
<NuxtLink :to="`/${data.item.name}/dashboard`"><img :src="data.item.image" width="25" height="25"><b>{{data.item.name}}</b></NuxtLink>
</template>
<template #cell(current_price)="data">
{{ formatDollar(data.item.current_price, 20, 2) }}
</template>
<template #cell(price_change_percentage_24h)="data">
{{ formatPercent(data.item.price_change_percentage_24h) }}
</template>
<template #cell(market_cap)="data">
{{ formatDollar(data.item.market_cap, 20, 0) }}
</template>
</b-table>
<b-spinner v-else/>
</b-container>
</template>
如您所见,每行点击都有一个点击处理程序,处理程序如下:
As you can see, there is a click handler for each row click, the handler is the following:
coinRowClickHandler: function(event) {
console.log(event)
this.$router.push(`/${event.name}/dashboard`)
}
现在我不确定使用哪种导航方法;无论是使用 还是通过
this.$router.push
编程.
Now I am unsure which navigation method to use; whether using <NuxtLink>
or programatically via this.$router.push
.
我保留程序化导航的主要原因仅仅是因为我不知道在行点击时触发页面更改的任何其他方法.另一方面,我担心我会失去 Tag 的 SEO 优势.
The main reason I would keep the programatic navigation is simply because I do not know any other way to trigger page change on row click. On the other hand, I am afraid I would lose SEO advantages of <NuxtLink>
Tag.
推荐答案
基本上是一个
,所以它应该与 Vue 变体相比,SEO 方面的优势为 0.
<nuxt-link>
is basically a <router-link>
, so it should have 0 benefit SEO-wise over the Vue variant.
至于在您的情况下使用什么,更多的是 button
与 a:href
的问题.如果你想导航到另一个页面,它应该是一个链接.
As of what to use in your case, it's more a matter of button
vs a:href
. If you want to navigate to another page, it should be a link.
本文中的更多详细信息:https://www.smashingmagazine.com/2019/02/buttons-interfaces/
More details in this article: https://www.smashingmagazine.com/2019/02/buttons-interfaces/
这篇关于<NuxtLink>与程序导航相比有 SEO 优势吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!