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
  }

由於channel被設置為一個空數組，我猜想redux並沒有認識到這是一個狀態的變化？ 但不能完全得到正確的解決方案。

編輯

我在if語句之前安裝了console.logged snapshot.exists（），並返回True。

我也在發送之前記錄了頻道，這似乎是存在問題的地方。 通道不會返回更新的值，而是更新時的先前值。

這是我用來將頻道項添加到用戶界面的代碼。 我正在尋找的動作是用戶創建一個頻道，該頻道創建一個包含成員uid和聊天信息的頻道。 然后將該信息推送到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);
        })
}

當我在createChannel（）結束時的console.log和在channel調度之前的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

謝謝Josh的回應。

我能夠解決我的問題。 我不得不切換數據庫條目的順序。 因為聊天推送是在能夠創建頻道條目之前觸發用戶聊天更新。 創建密鑰並使用它創建用戶密碼條目首先解決了更新問題。

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})
}