无法隐藏在 AWS Authenticator 之前显示的反应原生闪屏答案

【问题标题】：Not able to hide react native splashscreen shown before AWS Authenticator无法隐藏在 AWS Authenticator 之前显示的反应原生闪屏
【发布时间】：2021-11-23 21:11:34
【问题描述】：

我正在显示 react 本机闪屏并尝试将其隐藏在 useEffect 中，但如果我在 App.js 中使用 AWS Authenticator，则不会调用 useEffect。当我不使用身份验证器时，它工作正常。

App.js

import Amplify from 'aws-amplify';
import config from './src/aws-exports';
import { withAuthenticator } from 'aws-amplify-react-native';
import Auth from '@aws-amplify/auth';
import SplashScreen from 'react-native-splash-screen';
import { useEffect } from 'react';

function App (){
  useEffect(() => {
    SplashScreen.hide();
  });

  return ( 
    <View>
    </View>
  );
};
export default withAuthenticator(App);

如果我删除最后一行，它可以在没有 Authenticator 的情况下正常工作。

【问题讨论】：

有什么错误吗？你是怎么确定的？你没有为useEffect 提供依赖是故意的吗？其余的看起来很合理。
我现在也遇到了同样的问题，使用 withAuthenticator 时闪屏没有隐藏

标签： javascript react-native amazon-cognito aws-amplify react-native-splash-screen

【解决方案1】：

您需要更改状态才能触发 useEffect。 withAuthenticator 负责整个登录过程。所以要包括自定义，我建议使用 Authenticator （这是 WithAuthenticator 中的包装组件）。它具有 onStateChange 属性，可用于检测权限更改。

例子：

<Authenticator 
   // Fired when Authentication State changes, use it to hide/show stuff
   onStateChange={(authState) => console.log(authState)} 
>
   // Default components can be customized/passed in as child components. 
   // Define them here if you used hideDefault={true}
</Authenticator>

来源：AWS amplify Authenticator

【讨论】：