App.vue 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
  1. <template>
  2. <a-config-provider :locale="locale" :auto-insert-space-in-button="false">
  3. <RouterView v-if="isRouterReady" :key="routerKey">
  4. <template #default="{ Component, route }">
  5. <component
  6. :is="isFullScreen ? Component : BaseLayout"
  7. v-bind="isFullScreen ? {} : { content: Component }"
  8. v-on="isFullScreen ? {} : { refresh: refreshPage }"
  9. >
  10. <keep-alive>
  11. <component
  12. :is="Component"
  13. v-if="route.meta.keepAlive"
  14. :key="route.meta.usePathKey ? route.path : route.name"
  15. />
  16. </keep-alive>
  17. <component
  18. :is="Component"
  19. v-if="!route.meta.keepAlive"
  20. :key="route.meta.usePathKey ? route.path : route.name"
  21. />
  22. </component>
  23. </template>
  24. </RouterView>
  25. </a-config-provider>
  26. </template>
  27. <script setup lang="ts">
  28. import { computed, ref, onMounted } from 'vue'
  29. import BaseLayout from '@/layout/index.vue'
  30. import { useRoute, useRouter } from 'vue-router'
  31. import zhCN from 'ant-design-vue/es/locale/zh_CN'
  32. import dayjs from 'dayjs'
  33. import 'dayjs/locale/zh-cn'
  34. dayjs.locale('zh-cn')
  35. const locale = zhCN
  36. const route = useRoute()
  37. const router = useRouter()
  38. const isRouterReady = ref(false)
  39. const routerKey = ref(Date.now())
  40. onMounted(() => {
  41. router.isReady().then(() => {
  42. isRouterReady.value = true
  43. // 环境信息
  44. console.log(`🚀CurrentMode: ${import.meta.env.MODE}`)
  45. console.log(`🚀HostAPI: ${import.meta.env.VITE_APP_HOST}`)
  46. console.log(`🚀ProxyAPI: ${import.meta.env.VITE_APP_HOST}`)
  47. })
  48. })
  49. const isFullScreen = computed(() => Boolean(route.meta?.isFullScreen))
  50. console.log('🚀App route🚀', route)
  51. // 刷新页面
  52. const refreshPage = () => {
  53. routerKey.value = Date.now()
  54. }
  55. </script>
  56. <style scoped lang="less"></style>