Обновление Firebase Redux не запускает рендер

Question

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

Вот мое действие

export const fetchChannels = uid => dispatch => {
  db.ref(`chat/userchats/${uid}`).on("value", snapshot => {
    if (snapshot.exists()) {
      let userchats = snapshot.val()
      let channels = []
      Object.values(userchats).map(function(chat, i) {
        db.ref(`chat/chats/${chat}`).on("value", snap => {
          let chatData = snap.val()
          channels.push(chatData)
        })
      })

      dispatch({
        type: "FETCH_CHANNELS",
        payload: channels
      })
    }
  })
}

И мой редуктор

case 'FETCH_CHANNELS':
  return {
     ...state,
     channels:action.payload
  }

Так как каналы установлены в пустой массив, я предполагаю, что приставка не распознает это как изменение состояния? Но не могу получить правильное решение.

Редактировать

Я console.logged snapshot.exists () до оператора if, и он вернулся как True.

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

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

export const createChannel = (name,members,purpose) => dispatch =>{
  db.ref(`chat/chats/`).push({name,members,purpose})
        .then(result=>{
           let key = result.getKey()
           members.map(function(member,i){
            db.ref(`chat/userchats/${member}`).push(key)
            .then(result=>{})
            .catch(error=> {
              console.log(error)
            })
           })
        })
        .catch(error => {
          console.log(error);
        })
}

Когда я console.log в конце createChannel () и console.log перед отправкой каналов, в fetchChannel (). Когда я создаю канал, он показывает, что fetchChannels обновляется первым, а createChannel () - вторым, хотя сначала вызывается createChannel (), а fetchChannel () просто прослушивает обновление.

Вот элемент, который я пытаюсь перерисовать при обновлении реквизита

{Object.keys(this.props.channels).map(function(item,i){
        return(
            <Channel channel={this.props.channels[item].name} key={i} notification={''} selected={this.state.selected} item={item} onClick={()=>this.selectChannel(item)}/>
            )
    },this)}

Answer 1

Спасибо за ответы, Джош.

Мне удалось решить мою проблему.Мне пришлось изменить порядок записей в базе данных.Поскольку нажатие чатов инициировало обновление пользовательских чатов, прежде чем он смог создать запись каналов.Создание ключа и его использование для создания записей в чатах сначала решило проблему обновления.

export const createChannel = (name,members,purpose) => dispatch =>{
  let newKey = db.ref().push().getKey()
   members.map(function(member,i){
            db.ref(`chat/userchats/${member}`).push(newKey)
            .then(result=>{})
            .catch(error=> {
              console.log(error)
            })
           })
    db.ref(`chat/chats/${newKey}`).set({name,members,purpose})
}