O contexto

O contexto fornece objetos/parâmetros adicionais do Nuxt para os componentes de Vue e está disponível em áreas especiais como asyncData , fetch , plugins , middleware e o nuxtServerInit do ciclo de vida do Nuxt.

Note que: "O contexto" que referimos aqui não é para ser confundido com o objeto context disponível nas Ações do Vuex . Os dois não estão relacionados.

function (context) {
  // Chaves Universais
  const {
    app,
    store,
    route,
    params,
    query,
    env,
    isDev,
    isHMR,
    redirect,
    error,
    $config
  } = context
  // No Lado do Servidor
  if (process.server) {
    const { req, res, beforeNuxtRender } = context
  }
  // No Lado do Cliente
  if (process.client) {
    const { from, nuxtState } = context
  }
}

Chaves universais

Essas chaves estão disponíveis em ambos lado do cliente e servidor.

app

app (NuxtAppOptions)

As opções da instância raiz do Vue que incluem todos os seus plugins. Por exemplo, quando estiver usando o i18n, você pode obter o acesso ao $i18n através do context.app.i18n.

store

store (Memória do Vuex )

Instância da Memória do Vuex. Apenas disponível se a memória do vuex estiver definida.

route

route (Rota do Roteador do Vue )

Instância da Rota do Roteador do Vue.

params

params (Object)

Pseudónimo de route.params.

query

query (Object)

Pseudónimo de route.query.

env

env (Object)

Variáveis de ambiente definidas dentro do ficheiro nuxt.config.js, consulte a API de env .

isDev

isDev (Boolean)

Booleano para permitir você saber se está em modo de desenvolvimento, pode ser útil para cacheamento de algum dado em produção.

isHMR

isHMR (Boolean)

Booleano que permite saber se o método/intermediário é chamado a partir da substituição instantânea de módulo do webpack (é true apenas no lado do cliente no modo de desenvolvimento).

redirect

redirect (Function)

Use este método para redirecionar o usuário para um outra rota, o código de estado é usado no lado do servidor, o estado padrão será 302. redirect([status,] path [, query]).

Exemplos:

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

Consulte a documentação do Roteador do Vue para mais informações sobre a propriedade location.

error

error (Function)

Use este método para mostrar a página de erro: error(params). O params deve possuir as propriedades statusCode e message.

$config

$config (Object)

A atual configuração de tempo de execução .

Chaves do Lado do Servidor

Essas chaves apenas estão disponíveis no lado do servidor.

req

req (http.Request )

Requisição do servidor do Node.js. Se o Nuxt for usado como um intermediário, o objeto request pode ser diferente dependendo do framework que você estiver usando.
Não está disponível via nuxt generate.

Res

res (http.Response )

Resposta do servidor do Node.js. Se o Nuxt for usado como um intermediário, o objeto response pode ser diferente dependendo do framework que você estiver usando.
Não está disponível via nuxt generate.

beforeNuxtRender

beforeNuxtRender(fn) (Function)

Use este método para atualizar a variável __NUXT__ renderizada no lado do cliente, a função fn (pode ser assíncrona) is chamada com o objeto { Components, nuxtState }, consulte o exemplo .

Chaves do Lado do Cliente

Essas chaves estão apenas disponíveis no lado do cliente.

from

from (Rota do Roteador de Vue )

A rota de onde navegamos (onde nós saímos).

nuxtState

nuxtState (Object)

O estado do Nuxt, útil para plugins o qual usa o objeto beforeNuxtRender para receber o estado do Nuxt no lado do cliente antes da hidratação. Disponível apenas no modo universal.