如何根据前一个钩子函数的结果调用多个钩子函数

import React, { useState, useEffect } from 'react';

// 自定义钩子函数，用于检查用户登录状态
function useUserLoginStatus() {
  const [isLoggedIn, setIsLoggedIn] = useState(false);

  // 模拟异步获取登录状态
  useEffect(() => {
    setTimeout(() => {
      setIsLoggedIn(true); // 假设用户已登录
    }, 1000);
  }, []);

  return isLoggedIn;
}

// 自定义钩子函数，用于加载用户信息
function useUserInfo(isLoggedIn) {
  const [userInfo, setUserInfo] = useState(null);

  useEffect(() => {
    if (isLoggedIn) {
      // 模拟获取用户信息
      setTimeout(() => {
        setUserInfo({ name: 'John Doe', email: 'john@example.com' });
      }, 500);
    }
  }, [isLoggedIn]);

  return userInfo;
}

// 自定义钩子函数，用于设置定时刷新
function useRefreshTimer(isLoggedIn) {
  useEffect(() => {
    let timer;
    if (isLoggedIn) {
      timer = setInterval(() => {
        console.log('Refreshing data...');
      }, 5000);
    }

    return () => clearInterval(timer); // 清除定时器
  }, [isLoggedIn]);
}

function App() {
  const isLoggedIn = useUserLoginStatus();
  const userInfo = useUserInfo(isLoggedIn);
  useRefreshTimer(isLoggedIn);

  return (
    <div>
      {isLoggedIn ? (
        <div>
          <h1>Welcome, {userInfo.name}!</h1>
          <p>Your email is {userInfo.email}.</p>
        </div>
      ) : (
        <h1>Please log in.</h1>
      )}
    </div>
  );
}

export default App;