React Native Firebase onAuthState使用条件渲染更改 发出警告 无法执行 React 状态更新

Question

ReactNative 应用程序在关闭并重新打开时，会发出警告：无法对未挂载的组件执行 React 状态更新。似乎我的条件渲染导致了这种情况，如果我删除了初始屏幕部分，那就没问题了。

在渲染堆栈之前，renderScreens()下面关于建立 Firebase 连接时的初始屏幕。这有效，但我不断收到警告以清理useEffect函数。

if (auth.initializing) {
return <RootStack.Screen name={'Splash'} component={SplashScreen} />;
}
return auth.user && !auth.loading ? (
<RootStack.Screen name={'MainStack'} component={MainStackNavigator} />
) : (
<RootStack.Screen name={'AuthStack'} component={AuthStackNavigator} />
);

在我的身份验证钩子里

const [initializing, setInitializing] = useState<boolean>(true);
const [user, setUser] = useState<FirebaseAuthTypes.User | null>(null);
useEffect(() => {
auth().onAuthStateChanged(userState => {
setUser(userState);
if (initializing) setInitializing(false);
});
}, []);

尝试做unmount技巧，但没有帮助。下面是来自 react-native-firebase 的示例

// Handle user state changes
function onAuthStateChanged(user) {
setUser(user);
if (initializing) setInitializing(false);
}
useEffect(() => {
const subscriber = auth().onAuthStateChanged(onAuthStateChanged);
return subscriber; // unsubscribe on unmount
}, []);

在应用程序打开时，获取 auth.user 对象时总是有短暂的延迟，如果删除了初始屏幕，那么让经过身份验证的用户看到身份验证屏幕，然后在加载用户对象后立即更改为主应用程序，这很奇怪。我怎样才能正确处理这个问题而不引起警告。

Answer 1

我现在不确定警告部分，但有一件事可以避免这种情况：if splash screen is removed, then it's weird to have authenticated user to see the auth screen是将用户详细信息存储在某种本地存储中。我不记得localstorage的反应原生等价物，但在我的 React 应用程序中我这样做：

const [newUser, setNewUser] = useState(JSON.parse(localStorage.getItem('authUser')))

我直接从localstorage拉用户的地方. 这解决了我看到的"闪烁"，登录用户会短暂地看到登录屏幕onAuthStateChanged因为需要更长的时间才能启动。

然后，您可以在用户注销时删除localStorage。 啊，我只记得AsyncStorage.在以下方面可以实现相同的功能：https://reactnative.dev/docs/asyncstorage

如果您需要更多帮助，请告诉我！