コンテキスト

context は、Nuxt から Vue コンポーネントに追加のオブジェクト/パラメータを提供し、asyncData 、fetch 、plugins 、middleware そして nuxtServerInit のような特別な Nuxt ライフサイクル内で使用できます。

注意: ここで言う "コンテキスト" と、Vuex のアクション の中で使用できる context オブジェクトを混同しないでください。2 つは無関係です。

function (context) {
  // ユニバーサルなキー
  const {
    app,
    store,
    route,
    params,
    query,
    env,
    isDev,
    isHMR,
    redirect,
    error,
    $config
  } = context
  // サーバーサイド
  if (process.server) {
    const { req, res, beforeNuxtRender } = context
  }
  // クライアントサイド
  if (process.client) {
    const { from, nuxtState } = context
  }
}

ユニバーサルなキー

これらのキーは、クライアントサイドとサーバーサイドの両方で使用できます。

app

app (NuxtAppOptions)

すべてのプラグインを含むルート Vue インスタンスのオプション。たとえば i18n を使用している場合は context.app.i18n で $i18n にアクセスできます。

store

store (Vuex Store )

Vuex の Store インスタンス。Vuex ストアが設定されている場合のみ使用できます。

route

route (Vue Router Route )

Vue Router の route インスタンス。

params

params (Object)

route.params のエイリアス。

query

query (Object)

route.query のエイリアス。

env

env (Object)

nuxt.config.js で設定された環境変数。env API を参照してください。

isDev

isDev (Boolean)

開発モードであるかどうかを示す真偽値で、本番環境で一部のデータをキャッシュするのに役立ちます。

isHMR

isHMR (Boolean)

メソッド/ミドルウェアが webpack の hot module replacement から呼び出されたかどうかを示す真偽値（開発モードのクライアントサイドでのみ true）。

redirect

redirect (Function)

ユーザーを別のルートにリダイレクトするには、このメソッドを使用してください。ステータスコードはサーバーサイドで使用され、デフォルトは 302 です。 redirect([status,] path [, query])。

例：

redirect(302, '/login')
redirect({ name: 'slug', params: { slug: mySlug } })
redirect('https://vuejs.org')

Location プロパティの詳細については、Vue Router のドキュメントを参照してください。

ハイドレーションエラー（クライアントの内容が、サーバーが返すものと異なってしまう）のため、クライアントサイド限定の Nuxt プラグインの中では redirect や error を使用することはできません。有効な回避策は、window.onNuxtReady(() => { window.$nuxt.$router.push('/your-route') }) を使用することです。