Firebase + React Native: как получить все данные - PullRequest
0 голосов
/ 29 ноября 2018

Итак, я хочу получить все эти данные в своем коде и затем отобразить их

enter image description here

Я также прочитал много других вопросов и темкак документация Firebase, но все еще не понял, как это сделать правильно

Итак, у меня сейчас есть эта база данных выше и этот код ниже.

Но проблема в том, что она отображает только белый цветэкран, и я не могу найти свою ошибку.

Как я могу это исправить?

import firebase from "react-native-firebase";
import _ from 'lodash';

export default class Messagesss extends React.Component {
  state = {
   loading: false,
   users: []
  };

  componentWillMount() {
   var allMessages = firebase.database().ref(`/users`);
   allMessages.once('value').then(snapshot => {
  this.setState({ users: snapshot.val(), loading:false })
})
}

 renderItem({item}) {
   return (
     <View style = {styles.contactContainer}>
      <View style={styles.userRow}>
        <View style={styles.userImage}>
          <Avatar
            width={60}
            rounded
            source={{
              uri: "https://upload.wikimedia.org/wikipedia/commons/thumb/6/60/Matterhorn_from_Domhütte_-_2.jpg/1200px-Matterhorn_from_Domhütte_-_2.jpg"
            }}
          />
        </View>
         <View>
          <View style={styles.emailBackground}>
           <Text
             style = {styles.contact} >
             {item.email}
           </Text>
           </View>
           <Text
              style = {styles.message} >
              Da inne lauft öpis...
           </Text>
          </View>
         </View>
       </View>
     )
 }

 render() {
  if (this.state.loading) {
    return (
      <View style={{alignItems: 'center', justifyContent: 'center', flex: 1}}>
        <ActivityIndicator size="large" color="dodgerblue" />
      </View>
    )
  }
  return (
    <View style={styles.container}>
     <Header
       centerComponent={{ text: 'Nachrichten', style: { color: '#FF0000', fontSize: 20, fontWeight: 'bold' } }}
       outerContainerStyles={{ backgroundColor: '#ffffff' }}
     />
      <FlatList
        data={this.state.users}
        renderItem={this.renderItem}
        keyExtractor={item => item.uid}
      />
    </View>
  );
}
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...