Skip to content

Also allow <NuxtLink> to execute prefetch when to type props are RouteLocationRaw #19136

Description

@Mini-ghost

Describe the feature

In earlier issue, I mention a feature request that preloadRouteComponents allows passing values of type RouteLocationRaw👉 #18845 .

But I fund that the <NuxtLink> prefetch (or preload) just only execute when the props to type is string,

<!-- Passing a string -->
<!-- It will prefetch -->
<NuxtLink to="/home"> Home </NuxtLink>

<!-- Passing a string with query string -->
<!-- It will prefetch -->
<NuxtLink to="/home?year=2023"> Home </NuxtLink>

<!-- Passing a object -->
<!-- It will no prefetch -->
<NuxtLink :to="{ name: 'home', query: { year: '2023' } }"> Home </NuxtLink>

That's because of the following code:

const shouldPrefetch = props.prefetch !== false && props.noPrefetch !== true && typeof to.value === 'string' && props.target !== '_blank' && !isSlowConnection()
if (shouldPrefetch) {

One of the conditions for shouldPrefetch is typeof to.value === 'string'.

Is this expected? Or can this limit be remove?

If allow prefetch when <NuxtLink> to passing a value type of RouteLocationRaw, the app runtime lifecycle hook link:prefetch type must also be updated together

'link:prefetch': (link: string) => HookResult

Additional information

  • Would you be willing to help implement this feature?
  • Could this feature be implemented as a module?

Final checks

Metadata

Metadata

Assignees

Labels

3.x✨ enhancementNew feature or improvement to existing functionality🍰 p2-nice-to-haveNice to have, not blocking

Type

No type

Fields

No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions