0

有人可以帮我解决这个问题，我不知道为什么，但它没有显示任何我试图从 Firebase 导入数据的数据，但它只显示空白。当您单击这些“空白”之一（下面的打印屏幕）时，它将带您进入第二个屏幕，您将在那里看到所有数据。

对不起我的英语 - 我正在学习:)

import React, { Component } from 'react';
import { Text } from 'react-native';
import { StyleSheet, ScrollView, ActivityIndicator, View } from 'react-native';
import { ListItem } from 'react-native-elements'
import firebase from '../database/firebaseDb';

class SaveLocations extends Component {

constructor() {
    super();
    this.firestoreRef = firebase.firestore().collection('users');
    this.state = {
      isLoading: true,
      userArr: []
    };
  }

  componentDidMount() {
    this.unsubscribe = this.firestoreRef.onSnapshot(this.getCollection);
  }

  componentWillUnmount(){
    this.unsubscribe();
  }

  getCollection = (querySnapshot) => {
    const userArr = [];
    querySnapshot.forEach((res) => {
      const { coordinates, title, note } = res.data();
      userArr.push({
        key: res.id,
        res,
        coordinates,
        title,
        note,
      });
    });
    this.setState({
      userArr,
      isLoading: false,
    });
  }

  render() {
    if(this.state.isLoading){
      return(
        <View style={styles.preloader}>
          <ActivityIndicator size="large" color="#FF0000"/>
        </View>
      )
    }    
    return (
      <ScrollView style={styles.container}>
          {
            this.state.userArr.map((item, i) => {
              return (
                <ListItem
                  key={i}
                  chevron
                  bottomDivider
                  title={item.coordinates}
                  subtitle={item.title}
                  onPress={() => {
                  this.props.navigation.navigate
                    ('Details', {userkey: item.key});
                }}/>
              );
            })
          }
          
      </ScrollView>
    );
  }
}

export default SaveLocations;

在此处输入图像描述

4

0 回答 0