totole/build-gmail-clone-with-vue-3
1
0
Fork 0
mirror of https://github.com/kevin-DL/build-gmail-clone-with-vue-3.git synced 2026-01-23 23:51:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

Move modal into a portal, just because we can

Browse Source
This commit is contained in:
Jeffrey Biles
2020-03-18 13:29:53 -07:00
parent 874481cbde
commit 0a3982c2a4
2 changed files with 8 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/App.vue
View File

@@ -17,6 +17,8 @@
<p>Loading...</p> <p>Loading...</p>
</template> </template>
</suspense> </suspense>
<div id="modal-portal"></div>
</div> </div>
</template> </template>

10
src/components/MailTable.vue
View File

@@ -18,11 +18,13 @@
<td class="date">{{format(new Date(email.sentDate), 'MMM do yyyy')}}</td> <td class="date">{{format(new Date(email.sentDate), 'MMM do yyyy')}}</td>
</tr> </tr>
</tbody> </tbody>
</table>
<ModalView :isOpened="!!openedEmail" :closeModal="() => {openedEmail = null;}"> <portal target="#modal-portal">
<MailView :email="openedEmail" /> <ModalView :isOpened="!!openedEmail" :closeModal="() => {openedEmail = null;}">
</ModalView> <MailView :email="openedEmail" />
</ModalView>
</portal>
</table>
</template> </template>
<script> <script>