So entfernen Sie die neue Firebase onAuthStateChanged Listener in react

Ich implementiere die Firebase-Authentifizierung in einer React-Web-App mit React-Router.

Ein Benutzer meldet sich mit dem Popup-Login bei Facebook oder Google an (at / signin). Bei Erfolg richte ich eine Route zur Haupt-App (/) ein. In der Hauptkomponente der App warte ich auf eine Änderung des Authentifizierungsstatus:

  componentWillMount() {
    this.authListener = this.authListener.bind(this);
    this.authListener();
  }

authListener wartet auf die Berechtigungsänderung:

authListener() {
    firebase.auth().onAuthStateChanged((user) => {
      if (user) {
        console.log('user changed..', user);
        this.setState({
          User: {
            displayName: user.displayName
          }
        });
      } else {
        // No user is signed in.
        browserHistory.push('/signin');
      }
    });
  }

Alles funktioniert einwandfrei, es sei denn, ich melde mich ab (und gehe zurück zu / signin) und melde mich über Facebook oder Google erneut an. Dann erhalte ich eine Fehlermeldung:

Warning: setState (...): Kann nur eine gemountete oder gemountete Komponente aktualisieren.

Ich vermute, dass der onAuthStateChanged-Listener der jetzt nicht gemounteten vorherigen App mit angemeldetem Status noch ausgeführt wird.

Gibt es eine Möglichkeit, den onAuthStateChanged-Listener zu entfernen, wenn die App-Komponente ausgehängt wird?

Antworten auf die Frage(4)

Ihre Antwort auf die Frage