fix(admin): 修复首次进入系统后点击任意导航被拉回 dashboard
Some checks failed
CI / check (pull_request) Failing after 2m14s
Some checks failed
CI / check (pull_request) Failing after 2m14s
根因:RouteKeeper 保活缓存了首页 index 节点,DefaultRoute 中的声明式 <Navigate> 会随缓存节点在后续路由变化时反复触发 replace,导致所有导航 被强制拉回落地页(dashboard),刷新后因不再经过 / 而恢复正常。 修复:DefaultRoute 改为 effect 导航,仅在确实处于 / 且已算出落地页时 跳转一次;navigate 通过 ref 持有避免 effect 空转。新增集成测试覆盖 「首次进入 / → 跳转一次 → 后续导航不被劫持 → 回到 / 仍能重定向」。
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
import React from 'react';
|
||||
import { Navigate } from 'react-router';
|
||||
import React, { useEffect, useRef } from 'react';
|
||||
import { useLocation, useNavigate } from 'react-router';
|
||||
import { Result, Spin } from 'antd';
|
||||
import { usePermission } from '../hooks/usePermission';
|
||||
import { findRoleAwareLandingPath } from '../auth/menu-policy';
|
||||
@@ -8,14 +8,31 @@ import { useUserStore } from '../store/user/userStore';
|
||||
const DefaultRoute: React.FC = () => {
|
||||
const { permissions, permissionsReady } = usePermission();
|
||||
const roles = useUserStore((state) => state.user?.roles ?? []);
|
||||
const navigate = useNavigate();
|
||||
const { pathname } = useLocation();
|
||||
const firstPath = permissionsReady ? findRoleAwareLandingPath(roles, permissions) : null;
|
||||
|
||||
// 用 effect 导航替代声明式 <Navigate>:RouteKeeper 会把首页(index)节点保活缓存,
|
||||
// 声明式 <Navigate> 在缓存节点随路由变化重渲染时会反复触发,导致首次进入系统后
|
||||
// 点击任何按钮都被拉回 dashboard,必须刷新页面才能恢复。这里仅在确实处于首页
|
||||
// 且已计算出落点时跳转;navigate 通过 ref 持有,避免其每次渲染变化导致 effect 空转。
|
||||
const navigateRef = useRef(navigate);
|
||||
navigateRef.current = navigate;
|
||||
useEffect(() => {
|
||||
if (pathname === '/' && firstPath) {
|
||||
navigateRef.current(firstPath, { replace: true });
|
||||
}
|
||||
}, [pathname, firstPath]);
|
||||
|
||||
if (!permissionsReady) {
|
||||
return <Spin size="large" style={{ display: 'block', margin: '80px auto' }} />;
|
||||
}
|
||||
const firstPath = findRoleAwareLandingPath(roles, permissions);
|
||||
if (firstPath) return <Navigate to={firstPath} replace />;
|
||||
return (
|
||||
<Result status="403" title="暂无可访问功能" subTitle="请联系管理员为当前账号分配功能权限" />
|
||||
);
|
||||
if (!firstPath) {
|
||||
return (
|
||||
<Result status="403" title="暂无可访问功能" subTitle="请联系管理员为当前账号分配功能权限" />
|
||||
);
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
export default DefaultRoute;
|
||||
|
||||
Reference in New Issue
Block a user