import type { FC, PropsWithChildren, ReactElement } from 'react';
import React, { useMemo } from 'react';
import Taro from '@tarojs/taro';import useLoginState from '@/hooks/useLoginState';interface WithSignInComponentProps extends PropsWithChildren {children: ReactElement;ignoreAuth?: boolean; // 是否强制忽略验证登录redirect?: string;
}const WithSignInComponent: FC<WithSignInComponentProps> = ({children,ignoreAuth = false, // 是否强制忽略验证登录redirect // 跳转地址
}) => {const [, , action] = useLoginState();const eventRef = useMemo(() => children?.props?.onClick, [children?.props?.onClick]);const handleClick = async (e: Event) => {e.stopPropagation();try {const cookies = await action?.get();//本项目是存储的cookies,使用hooks----useLoginState能获取到const isLogin = !!(cookies && cookies?.length > 0);// 登陆判断if (ignoreAuth) {eventRef?.(e);return;}if (!isLogin) {await Taro.navigateTo({url: `登录的路由${redirect ? `?redirect=${encodeURIComponent(redirect)}` : ''}`});return;}eventRef?.(e);} catch {}};// @ts-ignorereturn React.cloneElement(children, { onClick: handleClick });
};export default WithSignInComponent;
使用方式:
//组件引用,放在了公共组件components下
import WithSignInComponent from '@/components/WithSignInComponent';
<WithSignInComponent><div>测试登录</div>
</WithSignInComponent>