Using router-link or nuxt-link
Many components in GOV.UK Vue let you pass in a link destination with the href prop. Internally, these components
use a normal <a> tag and add your href to it.
<gv-back-link href="/" />If you're writing a single-page application (SPA) using Vue Router or Nuxt, you probably want to use router-link or nuxt-link instead, to avoid a page reload when navigating to a new route.
Every link-based component in GOV.UK Vue lets you change which component is used to render the link. Just import the
component and pass it into the :component prop.
For components which take an href prop you can use to instead, but for components which use a different prop for link URLs, such as
Service navigation and its service-url prop, you'll still need to use that prop. These components
pass the URL to the href prop of your custom link component, so the component will need to support href (nuxt-link and router-link both do).
<script setup lang="ts">
import { NuxtLink } from '#components';
</script>
<template>
<gv-back-link :component="NuxtLink" to="/example-page" />
</template>