データをnuxt-linkに渡そうとしていますが、リンクをクリックするとnuxt-linkが404エラーを返します。ファイルの取得と読み込みが行われていないようです。
:hrefとハードコーディングを使用する2番目の2つのリンクは機能します
<h2 class="subtitle"><nuxt-link :to="{path: filePath}" exact>Nuxt View Menu</nuxt-link></h2>
<h2 class="subtitle"><a :href="filePath">Vue View Menu</a></h2>
<h2 class="subtitle"><a href="files/officialMenu.pdf">HardCode View Menu</a></h2>
<script>
export default {
layout: 'default',
data () {
return {
filePath: 'files/officialMenu.pdf'
}
}
}
</script>
NuxtとVue.jsの新機能。ありがとう!
Nuxtは、vue-routerのドキュメントを読み上げることで、vue-routerを使用します。これにより、必要なことを実現できます。
以下の例
<!-- named route -->
<nuxt-link :to="{ name: 'user', params: { userId: 123 }}">User</nuxt-link>
<!-- with query, resulting in `/register?plan=private` -->
<nuxt-link :to="{ path: 'register', query: { plan: 'private' }}">Register</nuxt-link>
これは、次のページの$ routeオブジェクトで$ route.paramsとして、または上記のURLクエリで使用できます。