You are browsing Nuxt 2 docs. Go to Nuxt 3 docs, or learn more about Nuxt 2 Long Term Support.

Translated page Contents of this page might be outdated.
Read the original page Improve translation of this page

O método validate

O Nuxt permite você definir um método validador dentro de um componente de rota dinâmica.

  • Tipo: Function ou Async Function

O validate é chamado toda vez antes de navegar para uma nova rota. Ele será chamado no lado do servidor uma vez (na primeira requisição para aplicação Nuxt) e no lado do cliente quando estiver navegando para rotas além. Este método recebe objeto de contexto como um argumento.

validate({ params, query, store }) {
  return true // se os parâmetros forem validos
  return false // impedirá o Nuxt de renderizar a rota e mostrará a página de erro
}

async validate({ params, query, store }) {
  // espere as operações
  return true // se os parâmetros forem validos
  return false // impedirá o Nuxt de renderizar a rota e mostrará a página de erro
}

Você pode também retornar promessas:

validate({ params, query, store }) {
  return new Promise((resolve) => setTimeout(() => resolve()))
}

O Nuxt permite você definir um método validador dentro do seu componente de rota dinâmica (Neste exemplo: pages/users/_id.vue).

Se o método validate não retornar true, o Nuxt carregará automaticamente a página de erro 404.

export default {
  validate({ params }) {
    // Deve ser um número
    return /^\d+$/.test(params.id)
  }
}

Você pode também verificar alguns dados dentro da sua memória por exemplo (preenchido pelo nuxtServerInit antes da ação):

export default {
  validate({ params, store }) {
    // Verifica se `params.id` é uma categoria existente
    return store.state.categories.some(category => category.id === params.id)
  }
}

Você pode também lançar erros esperados ou inesperados durante a execução da função validate:

export default {
  async validate({ params, store }) {
    // Lança um erro de código 500, erro do servidor interno com mensagem personalizada
    throw new Error('Under Construction!')
  }
}