Vue Nuxt.js でURLのクエリパラメータをテンプレートやscriptで利用する ( #Nuxt #Vue )

use $route.query in view template
use this.$route.query in script

index.vue

<template>
  <div>
      {{ $route.query }}
  </div>
</template>

<script>
export default {
  created () {
    console.log(this.$route.query)
  },
}
</script>

URL example

http://localhost:3000/url-query?id=1&foo=bar

View example

Original by Github issue

https://github.com/YumaInaura/YumaInaura/issues/3132

チャットメンバー募集

何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ

Twitter

https://twitter.com/YumaInaura

公開日時

2020-05-05