Nuxt.js #006 – ページをクエリストリングで動的に追加

ページをクエリストリングで動的に追加するメモ。

pagesディレクトリに、今回は「query.vue」任意ファイルを追加

query.vue

<template>

    <h3>{{query_add}}</h3>

</template>


<style>

    h3 {
        color: #ff4500;
    }

</style>


<script>

    export default {
        asyncData(context) {
            return {
                query_add: context.query['id']
            }
        }
    }

</script>

ページをクエリストリングで生成した場合は、静的ファイルを生成時にも動的に処理されるので「nuxt.config.js」を修正する必要はありません。

• 参考文献
  Nuxt.js