web-dev-qa-db-ja.com

Nuxt.jsで現在のルート名を取得する方法は?

静的なWebサイトを構築するためにNuxt.jsを使用しています。

現在表示されているルート名のコンポーネントのscriptコードでアクセスする方法(ブラウザーの場所から直接URLを読み取らないようにしたい)

$route.nameに何らかの方法でアクセスできますか?

14
lukaszkups

はい、$route.name$route.pathなどのvuejsルートオブジェクトを使用できます

$nuxt.$route.path

現在のパスを返す

$nuxt.$route.name

現在のルートの名前(ある場合)。

ルートオブジェクトプロパティ

ルートオブジェクトは、現在アクティブなルートの状態を表します。現在のURLの解析情報と、URLに一致するルートレコードが含まれます。

  • $ route.path

    • タイプ:文字列

    • 現在のルートのパスに等しい文字列で、常に絶対パスとして解決されます。例えば「/ foo/bar」。

  • $ route.fullPath

    • タイプ:文字列

    • クエリとハッシュを含む完全に解決されたURL。

**

そして、URLパラメータを取得したい場合。このような : - enter image description here これを行う:

  data() {
    return {
       zone: this.$nuxt.$route.query.zone,
       jour: this.$nuxt.$route.query.jour

    }   },

**

33
Mohammad b

別の方法は、次のいずれかを使用することです。

  • this.$route.pathhttp://localhost:3000の例、{{this.$route.path}}/を出力します
  • this.$route.namehttp://localhost:3000の例、{{this.$route.name}}indexを出力します
1