'ListItem from react-native-elements shows a blank list from Firestore DB

Here is a snapshot of the screen The ListItem shows up blank. I would like it to display the title and subtitle that is stored in my database.

return (
      <ScrollView style={styles.container}>
        {this.state.entryArr.map((item, i) => {
          return (
            <ListItem
              datasource={this.state.entryArr}
              titleStyle={{ color: "black", fontWeight: "bold" }}
              style={{ height: 55 }}
              key={i}
              chevron
              title={item.unit}
              subtitle={item.bio}
              onPress={() => {
                this.props.navigation.navigate("Details", {
                  userkey: item.key,
                });
              }}
            />
          );
        })}
      </ScrollView>
    );
}
}
const styles = StyleSheet.create({
  container: {
    paddingTop: 55,
    flex: 1,
    fontSize: 18,
    textTransform: "uppercase",
    fontWeight: "bold",
    
  },

I have tried to use a List from native-base and still not luck.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source