TypeError：无法读取未定义的属性（Reading＆＃x27; PathName＆＃x27;）错误

Question

我正在尝试将路线从一个组件传递到另一个组件，并且遇到了这个错误。

TypeError：无法读取未定义的属性（读取'PathName'）

我不知道为什么要遇到此错误。

这是我的用户访问

const useRouting = () => {
    const { primaryRole } = useAuth();
    const { asapUser } = useAsapContext();
    const [initialRoute, setInitialRoute] = useState(null);

    const routesMetadataForRole = useMemo(() => getRoutesForRole(primaryRole), [primaryRole]);

    const routes = useMemo(() => routesPerRole(routesMetadataForRole), [routesMetadataForRole]);

    useEffect(() => {
        if (primaryRole === 'asap-dept-member') {
            apiService.ApplicationService.getMemberApplication(asapUser.id).then(response => {
                const application = response.find(application => application.applicant.user.id === asapUser?.id);
                if (application !== null) {
                    setInitialRoute(routesMetadataForRole[2]?.path.replace(':id', application?.id));
                } else {
                    setInitialRoute(routesMetadataForRole[0]?.path);
                }
            });
        } else {
            setInitialRoute(routesMetadataForRole[0]?.path);
        }
    }, [primaryRole, routesMetadataForRole, asapUser.id]);

    return { routes, routesMetadataForRole, initialRoute };
};

，这是我的baselayoutretes

const BaseLayoutRoutes = () => {
    const navigate = useNavigate();
    const { routes, initialRoute } = useRouting();
    const location = useLocation();

    useEffect(() => {
        if (location.pathname === '/' && routes && routes.length > 0) {
            navigate(initialRoute, { replace: true });
        }
    }, [initialRoute, navigate, location.pathname, routes]);

    return <Routes>{routes}</Routes>;
};

中遇到的错误，

，最后是我从initialRoute

stacktrace

Answer 1

似乎错误和StackTrace通知您，initialRoute值传递给navigate> navigate函数是未定义的。

仅当存在initialRoute值时，仅发出重定向。

const BaseLayoutRoutes = () => {
  const navigate = useNavigate();
  const { routes, initialRoute } = useRouting();
  const location = useLocation();

  useEffect(() => {
    if (location.pathname === '/' && routes?.length && initialRoute) {
      navigate(initialRoute, { replace: true });
    }
  }, [initialRoute, navigate, location.pathname, routes]);

  return <Routes>{routes}</Routes>;
};