refactor:优化后台组件缓存功能细节

This commit is contained in:
妙码生花 2024-10-05 09:06:06 +08:00
parent a20e0183e5
commit dd49f8d260

View File

@ -34,7 +34,7 @@ const state: {
componentKey: string componentKey: string
keepAliveComponentNameList: string[] keepAliveComponentNameList: string[]
} = reactive({ } = reactive({
componentKey: route.path, componentKey: route.fullPath,
keepAliveComponentNameList: [], keepAliveComponentNameList: [],
}) })
@ -48,12 +48,21 @@ const addKeepAliveComponentName = function (keepAliveName: string | undefined) {
} }
} }
const addActiveRouteKeepAlive = () => {
if (navTabs.state.activeRoute) {
const tabView = navTabs.getTabsViewDataByRoute(navTabs.state.activeRoute.fullPath, navTabs.state.tabsViewRoutes, 'normal')
if (tabView && typeof tabView.meta?.keepalive == 'string') {
addKeepAliveComponentName(tabView.meta.keepalive)
}
}
}
onBeforeMount(() => { onBeforeMount(() => {
proxy.eventBus.on('onTabViewRefresh', (menu: RouteLocationNormalized) => { proxy.eventBus.on('onTabViewRefresh', (menu: RouteLocationNormalized) => {
state.keepAliveComponentNameList = state.keepAliveComponentNameList.filter((name: string) => menu.meta.keepalive !== name) state.keepAliveComponentNameList = state.keepAliveComponentNameList.filter((name: string) => menu.meta.keepalive !== name)
state.componentKey = '' state.componentKey = ''
nextTick(() => { nextTick(() => {
state.componentKey = menu.path state.componentKey = menu.fullPath
addKeepAliveComponentName(menu.meta.keepalive as string) addKeepAliveComponentName(menu.meta.keepalive as string)
}) })
}) })
@ -68,19 +77,15 @@ onUnmounted(() => {
}) })
onMounted(() => { onMounted(() => {
// keepalive // keepalive
if (typeof navTabs.state.activeRoute?.meta.keepalive == 'string') { addActiveRouteKeepAlive()
addKeepAliveComponentName(navTabs.state.activeRoute?.meta.keepalive)
}
}) })
watch( watch(
() => route.path, () => route.fullPath,
() => { () => {
state.componentKey = route.path state.componentKey = route.fullPath
if (typeof navTabs.state.activeRoute?.meta.keepalive == 'string') { addActiveRouteKeepAlive()
addKeepAliveComponentName(navTabs.state.activeRoute?.meta.keepalive)
}
} }
) )
</script> </script>