| 提交 | 用户 | age | ||
| 99ac30 | 1 | <template> |
| V | 2 | <div> |
| 3 | <router-view> | |
| 4 | <template v-slot="{ Component, route }"> | |
| 5 | <transition | |
| 6 | :name=" | |
| 7 | getTransitionName({ | |
| 8 | route, | |
| 9 | openCache, | |
| 10 | enableTransition: getEnableTransition, | |
| 11 | cacheTabs: getCaches, | |
| 12 | def: getBasicTransition, | |
| 13 | }) | |
| 14 | " | |
| 15 | mode="out-in" | |
| 16 | appear | |
| 17 | > | |
| 18 | <keep-alive v-if="openCache" :include="getCaches"> | |
| 19 | <component :is="Component" v-bind="getKey(Component, route)" /> | |
| 20 | </keep-alive> | |
| 21 | <component v-else :is="Component" v-bind="getKey(Component, route)" /> | |
| 22 | </transition> | |
| 23 | </template> | |
| 24 | </router-view> | |
| 25 | <FrameLayout v-if="getCanEmbedIFramePage" /> | |
| 26 | </div> | |
| 27 | </template> | |
| 28 | ||
| 29 | <script lang="ts"> | |
| 30 | import { computed, defineComponent, unref } from 'vue'; | |
| 31 | ||
| 32 | import FrameLayout from '/@/layouts/iframe/index.vue'; | |
| 33 | ||
| 34 | import { useRootSetting } from '/@/hooks/setting/useRootSetting'; | |
| 35 | ||
| 36 | import { useTransitionSetting } from '/@/hooks/setting/useTransitionSetting'; | |
| 0ec1a6 | 37 | import { useCache, getKey } from './useCache'; |
| 99ac30 | 38 | import { useMultipleTabSetting } from '/@/hooks/setting/useMultipleTabSetting'; |
| V | 39 | import { getTransitionName } from './transition'; |
| 40 | ||
| 41 | export default defineComponent({ | |
| 42 | name: 'PageLayout', | |
| 43 | components: { FrameLayout }, | |
| 44 | setup() { | |
| 45 | const { getCaches } = useCache(true); | |
| 46 | const { getShowMultipleTab } = useMultipleTabSetting(); | |
| 47 | ||
| 48 | const { getOpenKeepAlive, getCanEmbedIFramePage } = useRootSetting(); | |
| 49 | ||
| 50 | const { getBasicTransition, getEnableTransition } = useTransitionSetting(); | |
| 51 | ||
| 52 | const openCache = computed(() => unref(getOpenKeepAlive) && unref(getShowMultipleTab)); | |
| 53 | ||
| 54 | return { | |
| 55 | getTransitionName, | |
| 56 | openCache, | |
| 57 | getEnableTransition, | |
| 58 | getBasicTransition, | |
| 59 | getCaches, | |
| 60 | getCanEmbedIFramePage, | |
| 61 | getKey, | |
| 62 | }; | |
| 63 | }, | |
| 64 | }); | |
| 65 | </script> | |
