nuxt3使用动态路由的时候,遇到一个蛋疼的问题,如下:
navigateTo({
name: "user-dashboard-event-series-edit-detail-id",
params:{
id: id
}
})
使用 nuxtlink的时候一直报错,后来发现 to 参数里也是需要 params的
<NuxtLink
:to="{ name: 'user-dashboard-event-series-edit-detail-id'}"
class="flex items-center gap-2 hover:text-color-link-bolder"
:class="index === 0 ? 'font-semibold' : 'ml-5'"
>
<MIcon
v-if="linkItem.icon"
:name="linkItem.icon"
size="sm"
/>
<span class="text-sm transition-colors">
{{ linkItem.name }}
</span>
</NuxtLink>
改为:
const route = useRoute()
const id = route.params.id
<NuxtLink
:to="{ name: 'user-dashboard-event-series-edit-detail-id', params: { id: id }}"
class="flex items-center gap-2 hover:text-color-link-bolder"
:class="index === 0 ? 'font-semibold' : 'ml-5'"
>
<MIcon
v-if="linkItem.icon"
:name="linkItem.icon"
size="sm"
/>
<span class="text-sm transition-colors">
{{ linkItem.name }}
</span>
</NuxtLink>
就不报错了
