mirror of
https://github.com/kevin-DL/build-gmail-clone-with-vue-3.git
synced 2026-01-24 07:55:34 +00:00
clear selections when switching screens
This commit is contained in:
15
src/App.vue
15
src/App.vue
@@ -1,10 +1,10 @@
|
|||||||
<template>
|
<template>
|
||||||
<div id="app">
|
<div id="app">
|
||||||
<button @click="screenName = 'MailScreenArchived'"
|
<button @click="selectScreen('MailScreenArchived')"
|
||||||
:disabled="screenName == 'MailScreenArchived'">
|
:disabled="screenName == 'MailScreenArchived'">
|
||||||
Archived View
|
Archived View
|
||||||
</button>
|
</button>
|
||||||
<button @click="screenName = 'MailScreenInbox'"
|
<button @click="selectScreen('MailScreenInbox');"
|
||||||
:disabled="screenName == 'MailScreenInbox'">
|
:disabled="screenName == 'MailScreenInbox'">
|
||||||
Inbox View
|
Inbox View
|
||||||
</button>
|
</button>
|
||||||
@@ -22,6 +22,8 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
import MailScreen from '@/components/MailScreen.vue';
|
import MailScreen from '@/components/MailScreen.vue';
|
||||||
|
import useEmailSelection from './composition/useEmailSelection';
|
||||||
|
import { ref } from 'vue'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'App',
|
name: 'App',
|
||||||
@@ -29,8 +31,13 @@ export default {
|
|||||||
MailScreen
|
MailScreen
|
||||||
},
|
},
|
||||||
setup(){
|
setup(){
|
||||||
let screenName = 'MailScreenInbox';
|
let screenName = ref('MailScreenInbox');
|
||||||
return {screenName}
|
let {emailSelection} = useEmailSelection();
|
||||||
|
let selectScreen = function(newScreen){
|
||||||
|
screenName.value = newScreen;
|
||||||
|
emailSelection.clear();
|
||||||
|
}
|
||||||
|
return {screenName, selectScreen}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user