react-native firebase 将快照推送到数组答案

【问题标题】：react-native firebase push snapshots to arrayreact-native firebase 将快照推送到数组
【发布时间】：2018-09-08 21:47:23
【问题描述】：

我想将我从 firebase 获得的快照推送到一个数组，这样我就可以通过它进行映射，不知何故，对象会不断覆盖数组而不是附加到数组本身！

这是我的功能

  _getMessages = async () => {

    await firebase.database().ref('User-Message').child(this.state.fromUser).child(this.state.toUser).on('child_added', async (snapshot) => {

      let message_array = [];

      let message_id = await snapshot.key;

      let message_ref = await firebase.database().ref('Message').child(message_id).once('value', async (payload) => {

        await message_array.push(payload.val())

      })

      console.log(message_array);

    })

  }

它一直这样记录

[{
    toId : 'id',
    text : 'message',
    fromId : 'id',
    time : timestamp
}]
[{
    toId : 'id',
    text : 'message',
    fromId : 'id',
    time : timestamp
}]
[{
    toId : 'id',
    text : 'message',
    fromId : 'id',
    time : timestamp
}]
[{
    toId : 'id',
    text : 'message',
    fromId : 'id',
    time : timestamp
}]

我希望它在一个数组中，这样我就可以通过它进行映射

我怎样才能做到这一点？

【问题讨论】：

标签： javascript reactjs firebase react-native firebase-realtime-database

【解决方案1】：

只需将您的消息数组放在事件侦听器之外。

【讨论】：

【解决方案2】：

_getMessages = () => {
    let message_array = [];
    var isLoaded = false;
    var self = {
        onArrayChanged: () => {
            console.log(message_array);
        },
        currentArray: () => {
            return message_array;
        },
        load: ()=>{
            if(isLoaded)
                return Promise.resolve();
            return new Promise((res,rej)=>{
                firebase.database().ref('User-Message').child(this.state.fromUser).child(this.state.toUser).on('child_added', (snapshot) => {
                    let message_id = snapshot.key;
                    var promiseArray = [];
                    promiseArray.push(new Promise(res1,rej1)=>{
                        firebase.database().ref('Message').child(message_id).once('value', (payload) => {
                            message_array.push(payload.val());
                            if(isLoaded)
                                self.onArrayChanged();
                            else
                                res1();
                        });
                    });
                    Promise.all(promiseArray).then(()=>{
                        isLoaded = true; 
                        res();
                    }).catch(rej);
                });
            });
        }
    };
    return self;
  }

    // Usage

    var messages = _getMessages();
    try{
        await messages.load();
        console.log("loaded");
        console.log(messages.currentArray);
    }catch(e){

    }

【讨论】：

可能有一些语法错误（我用notepad++，没有测试）
哇！，我没有从你的代码中得到任何东西！ .. 我不能改用async/await 吗？
您不能使用 async / await 因为您的原始代码不依赖于 Promise。每个事件监听器单独执行。

【解决方案3】：

firebase.database().ref('Message').once('value') 
  .then((snapshot) => {
    const message_array= [];

     snapshot.forEach((childSnapshot) => {
       message_array.push({
        id: childSnapshot.key,
         ...childSnapshot.val()
       });
     });

【讨论】：

同样的结果 .. 用每个对象覆盖数组

【解决方案4】：

我同意维克多的回答。

_getMessages = async () => {

     await firebase.database().ref('User-Message').child(this.state.fromUser).child(this.state.toUser).on('child_added', async (snapshot) => {

           let message_array = []; // Why is the array initialized everytime on add?

           let message_id = await snapshot.key;    
           let message_ref = await  firebase.database().ref('Message').child(message_id).once('value', async (payload) => {    
              await message_array.push(payload.val())
           }) 

           console.log(message_array);
        })
}

【讨论】：