React Native，不理解调用firebase的异步函数流答案

【问题标题】：React Native, not understanding async function flow with call to firebaseReact Native，不理解调用firebase的异步函数流
【发布时间】：2021-01-30 21:56:12
【问题描述】：

我的目标是让 useEffect 访问我的 firebase 数据库并从中加载信息以进行显示。但它回来得太早了。我有 2 个控制台日志。 “z”日志在“y”之前返回。因此， tempArray 是空的。 “y”控制台填充了 tempArray。它只是在空的“z”之前打印到屏幕上。因此，没有任何显示。我怎样才能解决这个问题？我写错了什么？我希望我解释得很好，如果没有，我会用更多的代码进行编辑。感谢您的帮助。

  useFocusEffect(
    React.useCallback(() => {
      processList();
    }, [])
  );

  const processList = async () => { 
    let tempArray = [];
    query.once("value")
    .then(function(snapshot) {
      snapshot.forEach((child)=>{     
          if (child.key == id){
            let matchingDeals = child.val().matchingDeals;
            let mdArray = matchingDeals.split(',');
            mdArray.forEach((element)=> {
              db.ref('deals/' + element).once("value")
              .then((dealSnapshot)=>{
                    tempArray.push({
                      id: dealSnapshot.key,
                      title: dealSnapshot.val().hasOwnProperty('title') ? dealSnapshot.val().title : 'NA',
                      currentPrice: dealSnapshot.val().price,
                    })
                    console.log(tempArray + ' y '); 
              })
              .catch((error) => Sentry.Native.captureException('Error NotificationsCard function processList 1 ' + error))
            })
            console.log(tempArray + ' z ');
            setListNotifs(tempArray);
          }
      })
    })
    .catch((error) => {
      Sentry.Native.captureException('Error NotificationsCard function processList 2 ' + error)
    });
 }

【问题讨论】：

你没有使用 useEffect。在您的代码中是 useFocusEffect。将其更改为 React.useEffect(() =>{ processList() },[])
很好，看来我的问题仍然存在，但我需要改变它。谢谢。

标签： react-native

【解决方案1】：

在阅读了一些教程后，我发现更改我的代码以返回承诺而不是尝试制作一个大的 then 函数，这适用于我正在尝试做的事情：

  useEffect( ()=> {
    processList();
  }, []) 

 const processList = async () => { 
    let tempArray = [];
    query.once("value")
    .then(function(snapshot) {
      let promises = [];
      snapshot.forEach((child)=>{     
        if (child.key == id){
          let matchingDeals = child.val().matchingDeals;
          let mdArray = matchingDeals.split(',');
          mdArray.forEach((element)=> {
            promises.push(
              db.ref('deals/' + element).once("value")
            );
          })
        }
      })
      return Promise.all(promises);
    }).then(function(snapshots) {
      snapshots.forEach((child)=>{     
          tempArray.push({
            id: child.key,
            title: child.val().hasOwnProperty('title') ? child.val().title : 'NA',
            currentPrice: child.val().price,
          })
      })
      return tempArray;
    }).then(function(tempArray) {
      setListNotifs(tempArray); 
    })
 }

【讨论】：