Taro 路由拦截 身份认证 授权登录

import { useCallback, useEffect } from "react";
import { useUserStore } from "../../store";
import { getUserOrRedirectAuth } from "./actions";

/**
 * useAuthHOC: 高阶组件，用于处理用户认证
 * 接受一个 Component 作为参数，并返回一个新的组件，该组件在渲染时会检查用户是否已登录
 */
const useAuthHOC = Component => {
  return () => {
    const { userData, setUser } = useUserStore();
    // 初始化用户信息
    const initUser = useCallback(async () => {
      if (userData) return;
      // getUserOrRedirectAuth 的逻辑是已登录就返回用户数据存全局，没登录就跳登录
      const data = await getUserOrRedirectAuth();  
      data && setUser(data);
    }, [userData]);

    // 使用useEffect来在组件加载时初始化用户信息
    useEffect(() => {
      initUser();
    }, []);

    // 如果用户信息未初始化，则不渲染任何内容
    if (!userData || !userData.userNumber {  // !userData.userNumber 是我这儿需要的额外条件，你自己定制
      return null;
    }
    // 如果用户信息已初始化，则渲染传入的Component组件
    return <Component />;
  };
};
export default useAuthHOC;