<nuxt-link> コンポーネント

このコンポーネントは、ページコンポーネント間のナビゲーションを提供し、賢い prefetching（先読み）でパフォーマンスを高めるのに使用します。

<nuxt-link> は Nuxt の重要な要素です。あなたのアプリケーションを遷移するのに使われるべきコンポーネントで、従来の Vue アプリケーションにおける <router-link> と似ています。実際に、<nuxt-link> は <router-link> を拡張しています。つまり、同じプロパティを取り、同じように使うことができるということです。詳しくは、Vue Router のドキュメント を参照してください。

例（pages/index.vue）:

<template>
  <div>
    <h1>ホームページ</h1>
    <nuxt-link to="/about">このサイトについて（Nuxt アプリケーション内部リンク）</nuxt-link>
    <a href="https://nuxtjs.org">別のページへの外部リンク</a>
  </div>
</template>

エイリアス: <n-link>, <NuxtLink>, <NLink>

この機能は Nuxt.js v2.4.0 で追加されました

Nuxt.js アプリケーションの応答性を高めるため、viewport（ブラウザの表示領域）内にリンクが表示されたとき、Nuxt.js はコード分割されたページを自動的に先読みします。この機能は Google Chrome Labs の quicklink.js にインスパイアされています。

リンク先ページの先読みを無効化するために、no-prefetch プロパティを使うことができます:

<n-link to="/about" no-prefetch>（先読みしない）このサイトについて</n-link>

router.prefetchLinks を使って、この挙動をグローバルに設定することができます。

また、コード分割されたページの先読みが完了したとき付与される class をカスタマイズするため、 prefetched-class プロパティを使用することもできます。この機能は router.linkPrefetchedClass でグローバルに設定できることを必ず確認してください。