React Native中使用Firebase实现已登录用户自动跳转失败求助

我来帮你梳理下代码里的问题，然后给出可行的修复方案～

首先，你当前代码的核心问题在于：

• componentWillMount 这个生命周期方法在React 16.3之后已经被标记为不安全，而且在这个阶段调用 firebase.auth().currentUser 大概率拿不到正确的用户状态——因为Firebase的Auth状态是异步加载的，组件挂载时可能还没初始化完成，所以即使用户已经登录，这里也可能返回null。
• 你同时在componentWillMount和onAuthStateChanged里都做了导航操作，容易导致重复跳转，而且没有在组件卸载时取消订阅，可能引发内存泄漏。

修复后的代码示例 #

componentDidMount() {
  // 用onAuthStateChanged监听Auth状态变化，包括初始加载
  this.unsubscribe = firebase.auth().onAuthStateChanged(user => {
    if (user) {
      // 先检查当前路由，避免重复跳转
      const currentRoute = this.props.navigation.getCurrentRoute();
      if (currentRoute?.name !== 'Drawer') {
        this.props.navigation.navigate('Drawer');
      }
    }
    // 未登录的情况保持在登录页即可，无需额外操作
  });
}

componentWillUnmount() {
  // 组件卸载时取消订阅，防止内存泄漏
  if (this.unsubscribe) {
    this.unsubscribe();
  }
}

关键修复点说明 #

1. 改用componentDidMount：这个生命周期在组件挂载完成后执行，此时Navigation的上下文已经准备就绪，而且Firebase的Auth初始化也更有可能完成，配合onAuthStateChanged的监听能确保拿到准确的用户状态。
2. 只保留onAuthStateChanged监听：这个回调会在Auth状态初始化完成、用户登录/登出时触发，完全覆盖了你需要的场景，不需要额外读取currentUser。
3. 增加路由检查：避免用户已经在Drawer页面时重复执行导航操作，减少不必要的状态变化。
4. 组件卸载时取消订阅：防止组件销毁后还触发导航回调，避免内存泄漏和错误。

内容的提问来源于stack exchange，提问作者Amir