mirrors/pig-ui
1
0
Fork 0
mirror of https://gitee.com/log4j/pig-ui.git synced 2024-12-23 05:40:20 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

!78 修复跳转首页及由首页跳转其他页时面包屑组件异常的问题

Browse Source 
Merge pull request !78 from ZhangJinQi/master
This commit is contained in:
lbw 2024-05-02 09:54:05 +00:00 committed by Gitee
commit 6e84569302
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
1 changed files with 8 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/layout/navBars/breadcrumb/breadcrumb.vue
View File

@ -25,7 +25,7 @@
<script setup lang="ts" name="layoutBreadcrumb"> <script setup lang="ts" name="layoutBreadcrumb">
import { reactive, computed, onMounted } from 'vue'; import { reactive, computed, onMounted } from 'vue';
import { onBeforeRouteUpdate, useRoute, useRouter } from 'vue-router'; import { onBeforeRouteUpdate, RouteLocation, useRoute, useRouter } from 'vue-router';
import { Local } from '/@/utils/storage'; import { Local } from '/@/utils/storage';
import other from '/@/utils/other'; import other from '/@/utils/other';
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
@ -48,7 +48,7 @@ const state = reactive<BreadcrumbState>({
// 动态设置经典、横向布局不显示 // 动态设置经典、横向布局不显示
const isShowBreadcrumb = computed(() => { const isShowBreadcrumb = computed(() => {
initRouteSplit(route.path); initRouteSplit(route);
const { layout, isBreadcrumb } = themeConfig.value; const { layout, isBreadcrumb } = themeConfig.value;
if (layout === 'classic' || layout === 'transverse') return false; if (layout === 'classic' || layout === 'transverse') return false;
else return isBreadcrumb ? true : false; else return isBreadcrumb ? true : false;
@ -83,7 +83,8 @@ const getBreadcrumbList = (arr: RouteItems) => {
}); });
}; };
// 当前路由字符串切割成数组，并删除第一项空内容 // 当前路由字符串切割成数组，并删除第一项空内容
const initRouteSplit = (path: string) => { const initRouteSplit = (toRoute: RouteLocation) => {
let path = toRoute.path;
if (!themeConfig.value.isBreadcrumb) return false; if (!themeConfig.value.isBreadcrumb) return false;
state.breadcrumbList = [routesList.value[0]]; state.breadcrumbList = [routesList.value[0]];
state.routeSplit = path.split('/'); state.routeSplit = path.split('/');
@ -93,7 +94,7 @@ const initRouteSplit = (path: string) => {
getBreadcrumbList(routesList.value); getBreadcrumbList(routesList.value);
state.breadcrumbList.push(route); state.breadcrumbList.push(route);
// 首页或异常页只显示第一个 // 首页或异常页只显示第一个
if (route.name === 'router.home' || (route.name === 'staticRoutes.notFound' && state.breadcrumbList.length > 1)) { if (toRoute.name === 'router.home' || (toRoute.name === 'staticRoutes.notFound' && state.breadcrumbList.length > 1)) {
state.breadcrumbList.splice(0, state.breadcrumbList.length - 1); state.breadcrumbList.splice(0, state.breadcrumbList.length - 1);
} else if (state.breadcrumbList.length > 0) { } else if (state.breadcrumbList.length > 0) {
state.breadcrumbList[state.breadcrumbList.length - 1].meta.tagsViewName = other.setMenuI18n(<RouteToFrom>route); state.breadcrumbList[state.breadcrumbList.length - 1].meta.tagsViewName = other.setMenuI18n(<RouteToFrom>route);
@ -101,11 +102,12 @@ const initRouteSplit = (path: string) => {
}; };
// 页面加载时 // 页面加载时
onMounted(() => { onMounted(() => {
initRouteSplit(route.path); initRouteSplit(route);
}); });
// 路由更新时 // 路由更新时
onBeforeRouteUpdate((to) => { onBeforeRouteUpdate((to) => {
initRouteSplit(to.path); // 传入跳转的目标路由对象
initRouteSplit(to);
}); });
</script> </script>