Блог

Я пытаюсь настроить уведомления в React Native (0.55.4), я использую react navigation для отображения своих экранов. Все настроено, я получаю уведомления и могу считывать полезную нагрузку

Я сослался на следующую страницу, чтобы понять, как получен ответ —
https://rnfirebase.io/docs/v5.x.x/notifications/receiving-notifications

Я хотел бы знать, как я могу включить это так, чтобы событие вызывалось на любой странице моей навигации react всякий раз, когда получено уведомление, или вызывалось в фоновом режиме и обрабатывалось на основе полезной нагрузки.

В настоящее время она выполняется только в конструкторе и componentWillMount и других общих обратных вызовах, но я бы хотел, чтобы эта функция вызывалась каждый раз, когда я получаю уведомление, независимо от того, на какой странице я нахожусь.

То, что вы ищете, — это концепция субъекта. По сути, вам нужно транслировать события в том месте вашего приложения, где вы получаете уведомление. Все настроенные вами экраны, которые заинтересованы в уведомлениях, могут затем зарегистрироваться для прослушивания этих событий. Вот базовая тема, реализованная в JS, которую я использую в производстве, чтобы делать именно то, что вы описываете.

 const _handlers = {}

const Subject = {
  subscribe (...args) {
    const [event, handler] = args

    if (!_handlers[event]) _handlers[event] = []
    _handlers[event].push(handler)
  },
  unsubscribe (...args) {
    const [event, handler] = args

    if (!_handlers[event]) return
    _handlers[event] = _handlers[event].filter(func => func !== handler)
  },
  next (...args) {
    const [event, value] = args

    if (!_handlers[event]) return
    _handlers[event].forEach(handler => {
      if (typeof handler === 'function') {
        handler(value)
      }
    })
  }
}

Object.freeze(Subject)

module.exports = Subject
  

Вы можете использовать ее в своих компонентах следующим образом:

 notificationHandler = (payload) => {
  // Do something with the payload in your screen
}

componentDidMount () {
  Subject.subscribe('notification_received', this.notificationHandler)
}

componentWillUnmount () {
  Subject.unsubscribe('notification_received', this.notificationHandler)
}
  

При получении уведомления ваш прослушиватель уведомлений может вызвать Subject.next('notification_received', payload)