首页 > 解决方案 > firebase.auth().onAuthStateChanged 在每次选项卡更改时调用

问题描述

我正在使用带有 ionic 5 的 firebase。每次导航到另一个选项卡时,我都可以看到每次调用 firebase.auth().onAuthStateChanged。

我的代码是:

React.useEffect(() => {
  isLogin();
}, []);

const isLogin = async () => {
  var unsubscribe = firebase.auth().onAuthStateChanged(async (user) =>{
    if (user) {
      const store = new Storage();
      await store.create();
      const eventId = await store.get('eventId');
      const sendSms = await store.get('sendSms');
      const userContext: any = {
        uid: user.uid,
        eventId: eventId,
        sendSms: sendSms,
      };

      setContext(userContext);
      setShowLoader(false)

    } else {
      setShowLoader(false)
      setContext(undefined);

    }
  });
}
return (
  <Context.Provider value={[context, setContext]}>

  <IonApp>
    <IonLoading
      cssClass='my-custom-class'   
      isOpen={showLoader}
      message={'Please wait...'}
      duration={5000}
    />
     {context?.uid ?
  
      <IonTabs>
        <IonRouterOutlet>
          <Route path='/tabs/guests' component={Dashboard} exact />
          <Route path='/tabs/tables' component={Tables} exact />
          <Route path='/tabs/settings' component={Settings} exact />


        </IonRouterOutlet>
        <IonTabBar slot='bottom'>
          <IonTabButton tab='guests' href='tabs/guests'>
            <IonLabel>אורחים</IonLabel>
          </IonTabButton>
          <IonTabButton tab='tables' href='tabs/tables'>
            <IonLabel>שולחנות</IonLabel>
          </IonTabButton>
          <IonTabButton tab='settings' href='tabs/settings'>
            <IonLabel>הגדרות</IonLabel>
          </IonTabButton>
        </IonTabBar>
      </IonTabs>
   
    : <LoginPage />}
    </IonApp>
    </Context.Provider>
)

您能帮我找出重复调用身份验证状态更改事件处理程序的原因吗?

标签: javascriptreactjsfirebaseionic-frameworkfirebase-authentication

解决方案


推荐阅读