根据that component's documentation，您可以在代码中获得登录状态：

FacebookLoginClient.login((res) => {
  // "res" contains information about the current user's logged-in status
});

因此，在任何需要了解状态的组件中，只需引用库即可：

import { FacebookLoginClient } from '@greatsumini/react-facebook-login';

然后使用FacebookLoginClient.login检查用户的登录状态，如果状态不符合您定义的条件，则重定向用户（例如，您可以在useEffect中首次加载组件时检查此状态，或者如果您对此有顾虑，则可以在每次呈现时检查此状态）。

**编辑：**有关呈现目标组件的详细信息，由于useEffect发生在初始呈现之后，因此可以依赖其他状态进行检查。例如，考虑以下结构：

const [canRender, setCanRender] = useState(false);

useEffect(() => {
  FacebookLoginClient.login((res) => {
    // check the status and call "setCanRender" accordingly
  });
}, []);

if (!canRender) return <>Checking authentication...</>;

// your existing return for the component goes here

这里的想法是将组件默认为某种“加载状态”，并且仅在验证通过之后才呈现“安全”内容。