Question

尝试了解Firebase如何处理其条目，我一直在尝试从孩子那里收集所有密钥。

  <div v-for = "item in TeamArray">
        {{item['.key']}}
  </div>

当我尝试从HTML部分收集密钥时这很有效。但我想保存数组中的所有键。但是当我尝试将键保存在数组中而不是仅仅打印它们时，Vue会进入无限循环并且会一遍又一遍地为数组填充相同的值。

 <div v-for = "item in TeamArray">
        {{Save_Keys(item['.key'])}}
   </div>

如果TeamArray可以在HTML中迭代，我认为它可以与foreach循环一样使用。

Get_Keys: function () {
        this.$firebaseRefs.TeamArray.forEach(function(key){
          team_key_list.push(key['.key']);
        });
        for(let i = 0; i < team_key_list.length; i++)
          console.log(team_key_list[i])
      }

但是我得到一个错误，即forEach不是TeamArray的函数。

Firebase如何以这种方式运作？ Vue让我在HTML中迭代它，但在JS中需要其他东西吗？

由于

Answer 1

我不是VueFire专家，但可以帮助解释一些Firebase位。您的this.$firebaseRefs.TeamArray是Firebase database reference：对数据库中某个位置的引用。它实际上还没有任何数据，这就是你的参考循环失败的原因。

要从数据库引用中获取数据，请附加一个侦听器。最简单的方法是使用once()，它会读取一次数据：

this.$firebaseRefs.TeamArray.once("value", function(snapshot) {
  snapshot.forEach(function(child){
    team_key_list.push(child.key);
  });
  console.log(team_key_list);
});

此代码中可能存在一些错误，但主要是它只是基本的Firebase JavaScript SDK（docs），然后浏览相关的VueFire code和Vue.js code。

Vue-Firebase：从脚本中的firebase条目中收集所有密钥

1 个答案: