Skip to content

Commit

Permalink
feat(projects): reset scroll position when tab change
Browse files Browse the repository at this point in the history
  • Loading branch information
honghuangdc committed Jun 11, 2024
1 parent 6259287 commit 9094b21
Showing 1 changed file with 8 additions and 0 deletions.
8 changes: 8 additions & 0 deletions src/layouts/modules/global-content/index.vue
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
<script setup lang="ts">
import { computed } from 'vue';
import { LAYOUT_SCROLL_EL_ID } from '@sa/materials';
import { useAppStore } from '@/store/modules/app';
import { useThemeStore } from '@/store/modules/theme';
import { useRouteStore } from '@/store/modules/route';
Expand All @@ -24,6 +25,12 @@ const routeStore = useRouteStore();
const tabStore = useTabStore();
const transitionName = computed(() => (themeStore.page.animate ? themeStore.page.animateMode : ''));
function resetScroll() {
const el = document.querySelector(`#${LAYOUT_SCROLL_EL_ID}`);
el?.scrollTo({ left: 0, top: 0 });
}
</script>

<template>
Expand All @@ -32,6 +39,7 @@ const transitionName = computed(() => (themeStore.page.animate ? themeStore.page
:name="transitionName"
mode="out-in"
@before-leave="appStore.setContentXScrollable(true)"
@after-leave="resetScroll"
@after-enter="appStore.setContentXScrollable(false)"
>
<KeepAlive :include="routeStore.cacheRoutes">
Expand Down

0 comments on commit 9094b21

Please sign in to comment.