mirror of
https://github.com/kevin-DL/build-gmail-clone-with-vue-3.git
synced 2026-01-20 22:35:06 +00:00
Actually remove the modal when not in use
This commit is contained in:
@@ -20,7 +20,7 @@
|
||||
</tbody>
|
||||
|
||||
<portal target="#modal-portal">
|
||||
<ModalView :isOpened="!!openedEmail" :closeModal="() => {openedEmail = null;}">
|
||||
<ModalView v-if="!!openedEmail" :closeModal="() => {openedEmail = null;}">
|
||||
<MailView :email="openedEmail" />
|
||||
</ModalView>
|
||||
</portal>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="email">
|
||||
<div class="email" v-if="email">
|
||||
<div>From: {{email.from}}</div>
|
||||
<div>Subject: <strong>{{email.subject}}</strong></div>
|
||||
<div v-html="emailMarkdown" />
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="modal" v-if="isOpened">
|
||||
<div class="modal">
|
||||
<div class="overlay" @click="closeModal()"></div>
|
||||
<div class="modal-card">
|
||||
<slot :closeModal="closeModal" />
|
||||
@@ -17,7 +17,6 @@
|
||||
},
|
||||
methods: {
|
||||
onkey(event){
|
||||
if(!this.isOpened) { return null }
|
||||
|
||||
if(event.key == 'Escape') {
|
||||
this.closeModal()
|
||||
@@ -25,10 +24,6 @@
|
||||
}
|
||||
},
|
||||
props: {
|
||||
isOpened: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
},
|
||||
closeModal: {
|
||||
type: Function,
|
||||
required: true
|
||||
|
||||
Reference in New Issue
Block a user