保持页面状态

web/src/main.vue

@@ -49,7 +49,11 @@ const handleMenuClick = (e) => {
     </a-menu-item>
   </a-menu>
 
-  <router-view />
+  <router-view v-slot="{ Component }">
+    <keep-alive :include="['games', 'leagues', 'locales']">
+      <component :is="Component" />
+    </keep-alive>
+  </router-view>
 
 </template>
 

web/src/views/games.vue

@@ -182,8 +182,14 @@ const gamesRelationsFiltered = computed(() => {
 });
 
 onMounted(() => {
+  // console.log('games mounted');
   refresh();
 });
+
+onUnmounted(() => {
+  // console.log('games unmounted');
+});
+
 </script>
 
 <template>

web/src/views/home.vue

@@ -83,11 +83,13 @@ const refresh = () => {
 }
 
 onMounted(() => {
+  // console.log('home mounted');
   refresh();
   refreshTimer.value = setInterval(refresh, 1000 * 1);
 });
 
 onUnmounted(() => {
+  // console.log('home unmounted');
   clearInterval(refreshTimer.value);
 });
 

web/src/views/leagues.vue

@@ -163,8 +163,14 @@ const leaguesRelationsFiltered = computed(() => {
 });
 
 onMounted(() => {
+  // console.log('leagues mounted');
   refresh();
 });
+
+onUnmounted(() => {
+  // console.log('leagues unmounted');
+});
+
 </script>
 
 <template>

web/src/views/locales.vue

@@ -68,11 +68,15 @@ const tableChange = (pagination) => {
 };
 
 onMounted(() => {
+  // console.log('locales mounted');
   updateLocales();
 });
+
 onUnmounted(() => {
+  // console.log('locales unmounted');
   clearTimeout(setTimer.value);
 });
+
 </script>
 
 <template>