CameraMachine/frontend/src/App.vue

<template>
    <router-view v-slot="{ Component }">
      <keep-alive :include="keepAliveIncludes">
        <component :is="Component" />
      </keep-alive>
    </router-view>

    <Login v-model:dialogVisible="useUserInfoStore.loginShow" />

</template>
<script setup lang="ts">
import { useRoute, useRouter } from 'vue-router'
import Login from '@/components/login/index.vue';
import useUserInfo from "@/stores/modules/user";
const useUserInfoStore = useUserInfo();

import { listenerOnline } from '@/composables/online';
listenerOnline();

const router = useRouter()
const route = useRoute()
/* keep alive 的路由名称 */
const keepAliveIncludes = router
    .getRoutes()
    .filter((router) => router.meta?.keepAlive)
    .map((router) => router.name as string)



</script>


<style scoped>
.logo {
  height: 6em;
  padding: 1.5em;
  will-change: filter;
  transition: filter 300ms;
}
.logo:hover {
  filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.vue:hover {
  filter: drop-shadow(0 0 2em #42b883aa);
}
</style>