在尝试将 firebase 数据返回到另一个页面时，它传递了 undefined答案

【问题标题】：while trying to return firebase data to another page it passes undefined在尝试将 firebase 数据返回到另一个页面时，它传递了 undefined
【发布时间】：2021-12-20 13:53:10
【问题描述】：

我正在尝试从 Firebase 获取数据，我实现了与我的 react 本机应用程序几乎相同的代码，但这次我遇到了一些我无法弄清楚的问题。

import {db} from './firebase'
const formatMarketData = (data) =>{
    let formattedData = [];
    
    data.forEach(item=>{
    const formattedItem = {
        ...item
    }
    formattedData.push(formattedItem);
    });
    return formattedData;
    }
export const FirebaseService = async (id) => {
    id=id.replace(/['"]+/g, "");
    const historyKey="/coins/0/"+id
    await 
      db.ref(historyKey)
      .once('value')
      .then(snapshot => {
        const data = snapshot.val();
        const formattedResponse= formatMarketData(data);
        console.log(formattedResponse)
        return formattedResponse
      });
};

这个函数可以帮助我从我的 firebase rtdb 中检索数据。 console.log 函数按预期工作和写入，但是当我试图在我的新闻页面中捕获它时，它变得未定义。

import React from 'react'
import { useState,useEffect } from 'react'
import { FirebaseService } from '../../Services/FirebaseService'
const NewList = ({id}) => {
    const [data,setData] = useState([])
    useEffect(()=>{
        console.log(id)
        const fetchMarketData = async () =>{
        const marketData =  await FirebaseService(id);
        return setData(marketData);
        }
        fetchMarketData();
        return () => {
        }
    },[])
    return (
        <div>
           {data!==undefined?data.map((d)=>{return(<p>{d.id}</p>)})
                            :<p>no data yet</p>}
        </div>
    )
}

export default NewList

我遗漏了一些东西，但我没有注意到。另一种观点可能会有所帮助。

【问题讨论】：

标签： javascript reactjs firebase-realtime-database

【解决方案1】：

在函数开始时定义 formattedResponse 并在最后返回它。我已经编辑了你的功能

import {db} from './firebase'
const formatMarketData = (data) =>{
let formattedData = [];

data.forEach(item=>{
const formattedItem = {
    ...item
}
formattedData.push(formattedItem);
});
return formattedData;
}
export const FirebaseService = (id) =>{
let formattedResponse = [];
id=id.replace(/['"]+/g, "");
const historyKey="/coins/0/"+id
await 
  db.ref(historyKey)
  .once('value')
  .then(snapshot => {
    const data = snapshot.val();
     formattedResponse= 
     formatMarketData(data);
    console.log(formattedResponse)
    
  })
return formattedResponse
  };

【讨论】：

成功了，谢谢！