React Mobx Firebase.onAuthStateChanged слушатель

Я всегда помещал свой auth.onAuthStateChange().then(user => ... в componentDidMount() компонента React верхнего уровня.

Затем я бы удалил слушателя внутри componentWillUnmount()

Мой вопрос в том, как я могу это сделать? Моя идея примерно такая:

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

Затем я бы вызвал действие killFirebaseListener из componentWillUnmount компонента-контейнера верхнего уровня ... и просто использовал наблюдаемое пользователем, где это необходимо. Насколько я понимаю, когда мои наблюдаемые пользователем обновления после успешного входа в систему или выхода из системы, все мои слушатели будут обновляться и соответственно запускать повторный рендеринг ... я ошибаюсь в этом?

Есть ли у кого-нибудь опыт работы с такого рода "пользовательским слушателем" с mobx? Есть ли у кого-нибудь указатели или, может быть, ресурсы, которые они могут передать.


reactjs firebase mobx mobx-react
person archae0pteryx    schedule 20.08.2017    source источник

Ответы (2)


arrow_upward
2
arrow_downward

OK. Похоже, моя идея отлично работает. я добавил

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

и слушатель работает нормально / обновляется без проблем.

person archae0pteryx    schedule 20.08.2017

arrow_upward
0
arrow_downward

Для тех, кто борется с интеграцией react-mobx-firebase, я написал открытый исходный код инструментарий, который сделает все за вас. интеграция с firestore, аутентификация, дополнительный встроенный пользовательский интерфейс администратора, простой рендеринг и многое другое. надеюсь, кто-то сочтет это полезным. он называется orkan, попробуйте.

person Gilad    schedule 28.06.2019