Javascript Vue路由器4-重新加载页面后重定向到404页面

我有一个使用vue 3和vue路由器4的项目，我的问题是在我重新加载页面后，它会将我重定向到404页面。当我使用路线链接导航时，它会起作用

用户登录后，我尝试访问的路由将添加到路由列表中

下面是我的代码

创建路线

export const adminRoutes = [...Dashboard, ...Delivery, ...Couriers];
const routes: Array<RouteRecordRaw> = [...staticRoutes, ...Dashboard];
const router = createRouter({
      history: createWebHistory(), //createWebHistory(process.env.BASE_URL),
      routes
});

登录后添加管理员路由

const dynamicRoutes = generateRoutes(userPermission);
AuthStore.dispatch(AuthActions.SET_ROUTES, dynamicRoutes);
dynamicRoutes.forEach((route: RouteRecordRaw) => {
    router.addRoute(route);
});
console.log("NEXT ROUTE -------------", to);
console.log("ROUTER LIST -------------", router.getRoutes());
next();

用户登录后，重新加载/delivery，/delivery/edit它将重定向到404页面，但是/delivery，/delivery/edit基于控制台输出在路由列表中

---

如果重新加载，路由器将只有原始路由，在用户再次输入之前，您将看到404。这不是正在发生的事情吗？即使用户登录后，页面刷新时也会显示404。这与路由名称有关。因为如果您查看下一个路由的控制台输出，该路由没有名称和仅元路径。这是否回答了您的问题。是的，它适用于旧版本的Vue路由器，但您仍然需要相同的服务器端URL处理您如何导航到管理路由？？只有通过名称而不是路径导航时，名称才起作用。我想的另一件事是路由顺序，如果您的404是带有用于缓存所有未知路由的正则表达式的404，那么它应该是最后一个，文档没有指定新添加的路由是在现有路由之前还是之后解析。删除或评论你的404，看看是否是这样。我运行了一个测试，404没有捕获新添加的路由。我可以添加一个新的路由并立即导航到该路由，当然，如果你刷新，我也会立即重定向到404，因为在刷新时，动态路由不是路由器的一部分，路由器会将路由解到404，每次你重新加载应用程序时，包括任何添加的路由都会丢失。使用路线守卫来保护路线怎么样？？

const dynamicRoutes = generateRoutes(userPermission);
AuthStore.dispatch(AuthActions.SET_ROUTES, dynamicRoutes);
dynamicRoutes.forEach((route: RouteRecordRaw) => {
    router.addRoute(route);
});
console.log("NEXT ROUTE -------------", to);
console.log("ROUTER LIST -------------", router.getRoutes());
next();