2017-08-20 2 views
0

J'ai toujours mis mon auth.onAuthStateChange().then(user => ... à l'intérieur du componentDidMount() d'un composant React de haut niveau.Réagir Mobx Firebase.onAuthStateChanged écouteur

Je supprimerais l'auditeur à l'intérieur de componentWillUnmount()

Ma question est comment je MOBX-ifier cela? Mon idée est quelque chose comme ceci:

class Store { 
    @observable user = null 
    @action killFirebaseListener = this.removeListener() 
    constructor() { 
    this.removeListener = firebase.auth().onAuthStateChange(user => { 
     if (user) this.user = user 
    }) 
    } 
} 

Je voudrais donc appeler l'action killFirebaseListener du componentWillUnmount d'un conteneur composants de haut niveau ... et il suffit d'utiliser l'utilisateur observable si nécessaire. Je crois comprendre que lorsque mon utilisateur observable se met à jour lors d'une connexion ou d'une déconnexion réussie, tous mes écouteurs se mettent à jour et déclenchent un nouveau rendu en conséquence ... ai-je tort?

Quelqu'un a-t-il de l'expérience avec ce genre d '"écouteur utilisateur" avec mobx? Est-ce que quelqu'un a des indications ou peut-être des ressources qu'ils peuvent transmettre.

Répondre

1

OK. On dirait que mon idée fonctionne très bien. J'ai ajouté

class Store { 
    @observable user = null 
    constructor() { 
    firebase.auth().onAuthStateChanged(user => { 
     if (user) { 
     this.user = user 
     } 
    }) 
    } 
} 

et l'écouteur fonctionne très bien/mises à jour sans problème.