如何在React组件上获得 "FB "对象，用于Facebook登录？

我现在不会使用 react-facebook-login,www.npmjs.com/package/rea…

但我会在我的Next.js/React应用程序中根据Facebook的标准指令实现Facebook登录，我可以在Facebook开发者网站上找到。

我已经在_document.tsx 中添加了script 。我有Next.js，脚本在那里。

<script
  dangerouslySetInnerHTML={{
    __html: `
                                window.fbAsyncInit = function() {
                                    FB.init({
                                      appId      : '2773133082797983',
                                      cookie     : true,
                                      xfbml      : true,
                                      version    : 'v14.0'
                                    });
                                      
                                    FB.AppEvents.logPageView();   
                            `,
  }}
/>

但我如何才能执行以下调用？FB.getLoginStatus(

如何在一个自定义组件中获得对FB 对象的引用？

我试着在useEffect 中这样写。

export default function Home() {
    useEffect(() => {
        window.getLoginStatus(function (response) {
            statusChangeCallback(response)
        })
    }, [])

这是正确的方法吗？

另外，当我把这段代码放在React组件中返回时。

<fb:login-button 
  scope="public_profile,email"
  onlogin="checkLoginState();">
</fb:login-button>

我得到了这个错误。

Error: 
  x JSX Namespace is disabled by default because react does not support it yet. You can specify jsc.transform.react.throwIfNamespace to false to override default behavior
    ,----
 26 | <fb:login-button
    :  ^^^^^^^^^^^^^^^

我可以做什么呢？