Nuxt.js中如何将Firebase Firestore返回的对象转换为数组？

你好呀～看你的代码，问题出在没有把Firestore返回的每个文档数据收集到数组里，而且你用的jobs变量根本没初始化，所以commit的时候传的是未定义的内容，自然得不到想要的数组啦。

我给你改一下代码，你看：

async jobList({ commit }) {
  try {
    const response = await this.$fire.firestore.collection('Job').get()
    // 先创建一个空数组，用来装所有职位数据
    const jobs = []
    response.forEach((doc) => {
      // 把每个文档的数据存进数组，顺便带上文档ID（很多场景下ID很有用，比如后续修改/删除文档）
      jobs.push({
        id: doc.id,
        ...doc.data()
      })
      // 这里可以打印单个文档的数据确认是否正确
      console.log('单个职位数据:', doc.data())
    })
    // 等所有文档都遍历完，再一次性把数组提交到store
    commit('SET_JOBS', jobs)
    // 现在打印的就是完整的职位数组啦
    console.log('所有职位数组:', jobs)
  } catch (e) {
    // 用console.error打印错误，更容易在控制台发现问题
    console.error('获取职位列表出错了:', e)
  }
}

如果想更简洁，还可以用map方法直接生成数组，不用forEach，代码会更清爽：

async jobList({ commit }) {
  try {
    const response = await this.$fire.firestore.collection('Job').get()
    // 用map直接把docs转换成数组，同样带上ID
    const jobs = response.docs.map(doc => ({
      id: doc.id,
      ...doc.data()
    }))
    commit('SET_JOBS', jobs)
    console.log('所有职位数组:', jobs)
  } catch (e) {
    console.error('获取职位列表出错了:', e)
  }
}

原理很简单：Firestore的get()返回的是一个QuerySnapshot对象，它的docs属性是所有文档快照的集合，我们只需要遍历这个集合，把每个快照的data()（也就是文档里的实际数据）提取出来，放到数组里就可以啦。

备注：内容来源于stack exchange，提问作者Udemezue John