代码之家 › 专栏 › 技术社区 › Az Emna

从firebase检索数据的最快方法

firebase-realtime-database firebase javascript

1

Az Emna · 技术社区 · 6 年前

我正在使用firebase并从firebase数据库中检索数据“books”。然后将图书标题作为选项添加到select标记中。

问题是数据在选择列表中需要花费时间!因此,当我充电的页面选择列表是空的,4至5秒后,它显示的选项

这是我的密码

var db = firebase.database()
    var ref = db.ref(); 
    // get Titles 
    var databaseRef = firebase.database().ref('titres/');
    databaseRef.once('value' , function(snapshot) {
    snapshot.forEach(function(childSnapshot) {
    var childKey = childSnapshot.key;
    var childData = childSnapshot.val();
    const list = document.getElementById('favoris');
    [childSnapshot].forEach(item => {
      let option = document.createElement('option');
      option.value = item.key;   
      option.text=item.val().nom; 
     list.appendChild(option);
    });

      });
    });

有没有更好的办法? 谢谢

0 回复 | 直到 6 年前

1

0

itstrevino 6 年前

如果您正在使用React构建组件来处理数据并构建列表,下面是我从Firebase请求数据的方式:

let titresDB = firebase.database().ref('titres')
titresDB.once('value', (snapshot) => {
  let data = []
  snapshot.forEach((childSnapshot) => {
    data.push({
      _key: childSnapshot.key,
      ...childSnapshot.val()
    })
  })
  // then do something with the data
  // in React you could setState
  this.setState({ data })
})

    <ul>
      {this.state.data.map((book) => {
        return (
          <li key={book._key}>
            <h3>{book.title}</h3>
            <p>{book.rating}</p>
            <p>{book.description}</p>
          </li>
        )
      })}
    </ul>