Vale, esto ya lo ten铆a hecho desde el reto jaja, es m谩s simple y sencillo pasar el par谩metro del modal que quieres cerrar a la funci贸n closeModal, as铆 te evitas crear tantas funciones
Bienvenida e Introducci贸n
Bienvenida y Presentaci贸n del proyecto: PlatziRooms
Creaci贸n y configuraci贸n inicial del proyecto utilizando VUE CLI 3
Boilerplate y Limpieza del proyecto
Render Functions y JSX
驴Que son las Render Functions y JSX?
Preparando nuestro entorno para un prototipo
Creaci贸n de un componente con createElement
Utilizando JSX para la creaci贸n de un componente
Utilizando Slots con Render Functions y JSX
Creando un Modal de Login para PlatziRooms
Creando la l贸gica general de nuestros modales con Vuex
Creando el contenido de nuestro modal
Componentes controlados y uso de librer铆as externas
Componentes Controlados y Variables Personalizadas
Construcci贸n del componente de Recordar Contrase帽a
Creaci贸n de un componente Slider utilizando la librer铆a tiny-slider
High Order Functions
驴Qu茅 son las High Order Functions? - Crea tu primera HOF
Vuex
Obtener datos usando Vuex
Crea un getter din谩mico en Vuex utilizando HOF
Creaci贸n de la vista para creaci贸n de publicaciones
Agregando datos con Vuex
Base de datos en tiempo real con Firebase
Instalaci贸n y Configuracion de Firebase Realtime Database
Obteniendo los datos desde Firebase Realtime Database
Agregando la consulta de usuarios
Almacenando nuevas publicaciones en Firebase Realtime Database
Perfeccionando el flujo de navegaci贸n de nuestra App
Autenticaci贸n con Firebase
Configuracion Inicial para trabajar con Firebase Authentication
Agregando nuevos usuarios en firebase autentication
Inicio de sesi贸n de usuario
Cierre de sesi贸n de usuario
Protegiendo p谩ginas utilizando Navigation Guards
Scoped Slots
驴Qu茅 son los Scoped Slots? D贸nde utilizarlos y por qu茅
Integraci贸n de Scoped Slots en Platzi Rooms
Deploy
Creando y desplegando nuestra app en Heroku
Conclusiones y Despedida
No tienes acceso a esta clase
隆Contin煤a aprendiendo! 脷nete y comienza a potenciar tu carrera
No se trata de lo que quieres comprar, sino de qui茅n quieres ser. Invierte en tu educaci贸n con el precio especial
Antes: $249
Paga en 4 cuotas sin intereses
Termina en:
Javier Diaz Chamorro
Firebase nos proporciona una configuraci贸n muy sencilla para manejar la creaci贸n de usuarios, inicio de sesi贸n y logout de la aplicaci贸n con email y password o con redes sociales (Google Accounts, Facebook, Twitter, Github o incluso nuestros proveedores personalizados).
Tambi茅n tenemos acceso y control muy personalizado de toda esta informaci贸n gracias a la secci贸n de autenticaci贸n de usuarios en la Consola de Firebase; nos permite controlar todas nuestras cuentas de forma muy sencilla, podemos inhabilitar y eliminar usuarios, enviar correos electr贸nicos para cambiar contrase帽as y crear plantillas para configurar el env铆o de emails de nuestra aplicaci贸n.
El equipo de Google ha creado algunos SDKs (Software Development Kits) para facilitar la programaci贸n y configuraci贸n de estas funcionalidades en los lenguajes y plataformas m谩s comunes. En caso de no encontrar estas librer铆as oficiales, podemos buscar diferentes herramientas creadas por la comunidad.
Aportes 3
Preguntas 0
Vale, esto ya lo ten铆a hecho desde el reto jaja, es m谩s simple y sencillo pasar el par谩metro del modal que quieres cerrar a la funci贸n closeModal, as铆 te evitas crear tantas funciones
Otra forma de resolver el cierre de la Modal seria pasando el nombre de la modal como parametro al metodo closeModal
template
<modal :show="modals.login" @close-modal="closeModal('login')">login form</modal>
<modal :show="modals.register" @close-modal="closeModal('register')">register form</modal>
methods
methods: {
closeModal(name) {
this.$store.dispatch('TOGGLE_MODAL_STATE', {
name,
value: false,
});
},
registerHandlerSubmit() {
this.$store.dispatch('CREATE_USER', this.formRegister)
.then(() => {
this.closeModal('register');
});
},
},
otra forma de cerrar el modal es en el componente modal pasar como props en nombre y devolverlo en el emit:
name: 'Modal',
props: {
show: {
type: Boolean,
default: false,
},
name: {
type: String,
require: true,
},
},
methods: {
onClose() {
this.$emit('close-modal', this.name);
},
},
y en el Default layout llamarlo de esta manera:
<modal :show="modals.login" name="login" @close-modal="(name) => closeModal(name)">
slot
</modal>
y en el metodo de layout as铆:
methods: {
closeModal(name) {
this.$store.dispatch('TOGGLE_MODAL_STATE', {
name,
value: false,
});
},
},
驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad?