feat(projects): 添加reload context

This commit is contained in:
Soybean
2021-09-18 22:16:31 +08:00
parent 99adbc5a30
commit 03ebd49c86
17 changed files with 354 additions and 228 deletions

View File

@ -0,0 +1,6 @@
<template>
<div></div>
</template>
<script lang="ts" setup></script>
<style scoped></style>

View File

@ -19,6 +19,7 @@
{{ item.meta?.title }}
</n-tag>
</n-space>
<h3>{{ reload }}</h3>
<div class="flex-center w-32px h-32px bg-white cursor-pointer" @click="handleReload">
<icon-mdi-refresh class="text-16px" />
</div>
@ -30,7 +31,8 @@ import { computed, watch } from 'vue';
import { useRoute } from 'vue-router';
import { NSpace, NTag } from 'naive-ui';
import { useThemeStore, useAppStore } from '@/store';
import { useRouterChange } from '@/hooks';
// import { useRouterChange } from '@/hooks';
import { useReloadInject } from '@/context';
import { ROUTE_HOME } from '@/router';
defineProps({
@ -44,7 +46,8 @@ const route = useRoute();
const theme = useThemeStore();
const app = useAppStore();
const { initMultiTab, addMultiTab, removeMultiTab, setActiveMultiTab, handleClickTab } = useAppStore();
const { toReload } = useRouterChange();
// const { toReload } = useRouterChange();
const { reload, handleReload } = useReloadInject();
const fixedHeaderAndTab = computed(() => theme.fixedHeaderAndTab || theme.navStyle.mode === 'horizontal-mix');
const multiTabHeight = computed(() => {
@ -56,9 +59,9 @@ const headerHeight = computed(() => {
return `${height}px`;
});
function handleReload() {
toReload(route.fullPath);
}
// async function handleReload() {
// // toReload(route.fullPath);
// }
function init() {
initMultiTab();

View File

@ -19,9 +19,9 @@
<n-layout-content class="flex-auto" :class="{ 'bg-[#f5f7f9]': !theme.darkMode }">
<router-view v-slot="{ Component }">
<keep-alive>
<component :is="Component" v-if="routeProps.keepAlive" :key="routeProps.name" />
<component :is="Component" v-if="routeProps.keepAlive && reload" :key="routeProps.name" />
</keep-alive>
<component :is="Component" v-if="!routeProps.keepAlive" :key="routeProps.name" />
<component :is="Component" v-if="!routeProps.keepAlive && reload" :key="routeProps.name" />
</router-view>
</n-layout-content>
<global-footer />
@ -36,12 +36,14 @@
import { computed } from 'vue';
import { NLayout, NScrollbar, NLayoutContent } from 'naive-ui';
import { useThemeStore } from '@/store';
import { useReloadInject } from '@/context';
import { GlobalSider, GlobalHeader, GlobalTab, GlobalFooter, SettingDrawer } from './components';
import { useRouteProps, useScrollBehavior } from '../composables';
const theme = useThemeStore();
const { scrollbar } = useScrollBehavior();
const routeProps = useRouteProps();
const { reload } = useReloadInject();
const isHorizontalMix = computed(() => theme.navStyle.mode === 'horizontal-mix');
const headerAndMultiTabHeight = computed(() => {