时间戳

首页 > 解决方案 > 从 Firebase 实时数据库和存储中获取日期和文件

javascript - 从 Firebase 实时数据库和存储中获取日期和文件

问题描述

我需要从实时数据库中检索数据，并从 firebase 存储中检索文件。firebase实时数据库的结构是

Object {
    "2020": Object {
         "duG0Y3r3FvBk2foJj0RC": Object {
              "details": "chapter 2",
              "title": "differential calculus",
        
      },
    },
},

firebase 存储也具有相同的文件结构。章节/年/duG0Y3r3FvBk2foJj0RC/文件名pdf

我在 Componenetdidmount 中的代码如下所示

    firebase.database().ref("chapters").once("value", (userSnapshot) => {
      const temp = [];
      const fls = [];
      userSnapshot.forEach(yr => {
        const year = yr.key;
            yr.forEach(element => {
                const key = element.key;
                const title = element.child('title').val();
                const details = element.child('details').val();
                var pref = 'chapters/'+year+'/'+key+'/';                
                var listRef = firebase.storage().ref(pref);
                  listRef.listAll().then((res) => {
                    const filelist = [];
                        res.items.forEach((itemRef) => {
                          var files = itemRef.name;
                          listRef.child(files).getDownloadURL().then((fileurl)=>{
                            filelist.push({fileurl});
                            }).catch(function(error) {
                            // Handle any errors
                          });
                        });
                      }
                    }).catch((error) => {
                      console.log(error)
                    }); 
               temp.push({key, year, details, title, filelist});
            }); 
        });
     });
    this.setState({temp});
});

上面的代码正在获取数据和 url，但问题在于 promise 或 async/await。代码在获取 url 之前完成并设置状态。如何编写语句以便在完成设置状态之前完成获取 url。

标签： javascriptfirebasees6-promise

解决方案

你可以使用 Promise 的 .then() 函数，这里是一个简单的例子：-

const fetchSubjects=(key)=>{

      db.collection("Utilities").doc("Subjects").get()
      .then(result=>{
        let data = result.data();
         /*process Data*/
        setSubjects(subjects);
      });

    }

我正在使用钩子，所以方法'setSubjects（）'，你可以在那里做setState

推荐阅读