Login

Formulário completo de login com suporte a autenticação por email/senha e email link.

Props:

fallbackRedirectUrl (string, padrão: "/") - URL para redirecionar após login bem-sucedido

initialValues (object, opcional) - Valores iniciais para preencher os campos do formulário

emailAddress (string) - Email ou username

password (string) - Senha

signUpUrl (string, opcional) - URL para redirecionar quando o usuário clicar em "Cadastre aqui". Se não fornecido, emite evento sign-up

Eventos:

completed - Emitido quando o login é concluído com sucesso

sign-up - Emitido quando o usuário clica em "Cadastre aqui" e não há signUpUrl definido

Exemplos:

<template>
  <SignIn
    fallbackRedirectUrl="/dashboard"
    :initialValues="{ emailAddress: 'usuario@exemplo.com' }"
    signUpUrl="/register"
  />
</template>

<script setup>
import { SignIn } from '@autenticar-me/vue'
</script>

<template>
  <SignIn
    @completed="handleLoginCompleted"
    @sign-up="showSignUpModal"
  />
</template>

<script setup>
import { SignIn } from '@autenticar-me/vue'

const handleLoginCompleted = () => {
  console.log('Login realizado com sucesso!')
}

const showSignUpModal = () => {
  console.log('Usuário quer se cadastrar')
}
</script>

Botão que abre um modal de login quando clicado.

Props:

fallbackRedirectUrl (string, padrão: "/") - URL para redirecionar após login bem-sucedido no modal

signUpUrl (string, opcional) - URL para redirecionar quando o usuário clicar em "Cadastre aqui" dentro do modal. Se não fornecido, alterna para o formulário de cadastro dentro do modal

Exemplo:

<template>
  <SignInButton
    fallbackRedirectUrl="/dashboard"
    signUpUrl="/register"
  />
</template>

<script setup>
import { SignInButton } from '@autenticar-me/vue'
</script>

SignIn - Formulário de login#

SignInButton - Modal de login#

SignIn - Formulário de login

SignInButton - Modal de login