feat: (store)增加了对未定义组件的处理,添加更新页签名称方法

- 在多级菜单详情示例中使用了新的标签名称
This commit is contained in:
zimo493
2025-09-01 14:33:24 +08:00
parent 5d3e92bcf5
commit 7c1d5f6552
3 changed files with 31 additions and 9 deletions

View File

@@ -27,8 +27,6 @@ export const usePermissionStore = defineStore("permission", () => {
isDynamicRoutesGenerated.value = true;
console.log("dynamicRoutes", dynamicRoutes);
return dynamicRoutes;
} catch (error) {
console.error("❌ Failed to generate routes:", error);
@@ -85,13 +83,17 @@ const parseDynamicRoutes = (rawRoutes: RouteVO[]): RouteRecordRaw[] => {
rawRoutes.forEach((route) => {
const normalizedRoute = { ...route } as RouteRecordRaw;
// console.log();
// 处理组件路径
normalizedRoute.component =
normalizedRoute.component?.toString() === "Layout"
? Layout
: modules[`../../views/${normalizedRoute.component}.vue`];
if (!normalizedRoute.component) {
// 如果没有组件,则将组件设置为 undefined 防止404 例如(多级菜单的父菜单)
normalizedRoute.component = undefined;
} else {
// 处理组件路径
normalizedRoute.component =
normalizedRoute.component?.toString() === "Layout"
? Layout
: modules[`../../views/${normalizedRoute.component}.vue`] ||
modules[`../../views/error/404.vue`]; // 找不到页面时返回404页面
}
// 递归解析子路由
if (normalizedRoute.children) {

View File

@@ -97,6 +97,19 @@ export const useTagsViewStore = defineStore("tagsView", () => {
}
}
/**
* 根据路径更新标签名称
* @param fullPath 路径
* @param title 标签名称
*/
function updateTagName(fullPath: string, title: string) {
const tag = visitedViews.value.find((tag: TagView) => tag.fullPath === fullPath);
if (tag) {
tag.title = title;
}
}
function addView(view: TagView) {
addVisitedView(view);
addCachedView(view);
@@ -257,5 +270,6 @@ export const useTagsViewStore = defineStore("tagsView", () => {
closeCurrentView,
isActive,
toLastView,
updateTagName,
};
});

View File

@@ -1,15 +1,21 @@
import router from "@/router";
import { ElButton } from "element-plus";
import { useTagsViewStore } from "@/store";
export default defineComponent({
name: "ToDetail",
setup() {
const route = useRoute();
const tagsViewStore = useTagsViewStore();
// 跳转详情
const navigateToDetail = async (id: number) => {
await router.push({
path: "/detail/" + id,
query: { message: `msg${id}` },
});
// 更改标题
tagsViewStore.updateTagName(route.fullPath, `详情页缓存(id=${id})`);
};
return () =>
h("div", null, [