Skip to content

Instantly share code, notes, and snippets.

@ianaya89
Last active November 12, 2019 21:31
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ianaya89/cdbbafecaf6c6604031c1e857c30c7ff to your computer and use it in GitHub Desktop.
Save ianaya89/cdbbafecaf6c6604031c1e857c30c7ff to your computer and use it in GitHub Desktop.

Práctica Módulo 3

Armar un componente modal que se muestre al hacer click en un boton del componente padre (root) y que pueda ocultarse/cerrarse con otro boton dentro del componente modal

Hace fork de este CodePen para obtener la estructura básica del proyecto:

Consideraciones:

  • El componente modal debe:

    • Usar una propiedad title para poder establecer el titulo del modal.
    • Definir un slot para poder establecer el body del modal.
    • Tener un boton con una directiva v-on a un metodo que emita un evento llamado close.
  • El componente root (Componente Principal) debe:

    • Utilizar el component modal y mostrarlo solo cuando la propiedad showModal sea true.
    • Definir una propiedad boolean llamada showModal que permite ocultar y mostrar el modal.
    • Definir un método toggleModal que permita cambiar el valor de la propiedad showModal a su valor contrario (este metodo debe usarse con el boton "Show Modal").
    • Escuchar el evento close del modal y ejecutar el metodo toggleModal cuando este se emite.
    • Establecer el contenido de title del modal usando una propiedad y el contenido del bodyusando slots.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment