Question

我有一个要提取并显示在平面列表中的数据结构，这是我的数据。

-Lt10FlMt0xtru36Ztmb
                  name : "Hello"
-Lt0pdC5Ikwd-ZWNBiYJ
                  name : "Coke"
-Lt0paPi_-zkCelfoisM
                  name : "Pespsi"

这是我的代码：

  readUserData = () => {

        firebase.database().ref('Brands/').once('value').then((snapshot) => {
            console.log(snapshot.val())
            const userdata = snapshot.val();

            //  Alert.alert("Helo" , userdata);
            this.setState({
              getListbrands : userdata

            })
            Alert.alert("Data" , JSON.stringify(this.state.getListbrands))


        });

    }

在这里，我在“平面”列表中设置数据，但未显示任何内容，请指导。

{
  this.state.getListbrands &&
  <FlatList
  data={this.state.getListbrands}
  keyExtractor={(a, b) => b.toString()}
  renderItem={({ item }) => (
    <Text style={{color:'#000'}}>{item.name}</Text>
  )}

/>
}

Answer 1

根据文档，FlatList component需要一个数组数据。快照的值是一个对象，而不是数组。

如果要使用每个子节点的值的数组，则可以使用以下方法得到它：

firebase.database().ref('Brands/').once('value').then((snapshot) => {
    userdata = [];
    snapshot.forEach((child) {
        userdata.push(snapshot.val());
    })
    ...

然后可以将此数组设置为FlatList。

Answer 2

{
  this.state.getListbrands &&
  <FlatList
  data={this.state.getListbrands}
  keyExtractor={(a, b) => b.toString()}
  renderItem={(item) => (
    <Text style={{color:'#000'}}>{item.name}</Text>
  )}

/>
}

这样的更改。我认为此处的项目不是对象。请尝试。它会工作。谢谢。

从Firebase实时数据库中获取平面列表中的数据

2 个答案: