Может кто-нибудь мне помочь? когда происходят изменения в базе данных (я использую firestore), появляется ошибка « TypeError: undefined не является функцией (рядом с '... querySnapshot.forEach ...') " У меня такое ощущение, что это Ошибка в функции onCollectionstore . когда я отклоняю ошибку, она работает, но я не хочу иметь ошибку, потому что мое приложение может обработать sh.
import React, { Component } from 'react';
import {
StyleSheet, View, Alert, TextInput, Button, Text, Platform, TouchableOpacity, FlatList, ActivityIndicator, SafeAreaView, Image
} from 'react-native';
import { Actions } from 'react-native-router-flux';
import firebase from './firebase';
export default class ScarletScreen extends Component{
constructor() {
super();
const userId = firebase.auth().currentUser.uid;
this.unsubscribes = null;
this.ref = firebase.firestore();
this.unsubscribe = null;
this.state = {
isLoading: true,
dataSource: [],
dataSources: [],
store_address: '',
store_contact: '',
store_id: '',
store_image: '',
store_section: '',
store_email: '',
store_name: '',
store_password: '',
store_status: '',
store_wallet: '',
};
}
componentDidMount() {
const userId = firebase.auth().currentUser.uid;
this.unsubscribe = this.ref.collection('orders').where("OrderStatus", "==", "Pending").where("StoreID", "array-contains", userId).onSnapshot(this.onCollectionUpdate);
this.unsubscribes = this.ref.collection('stores').where("store_id", "==", userId).onSnapshot(this.onCollectionstore);
}
onCollectionstore = (querySnapshot) => {
const dataSources = [];
querySnapshot.forEach((doc) => {
const { store_name,
store_status,
store_wallet,
} = doc.data();
dataSources.push({
key: doc.id,
doc, // DocumentSnapshot
store_name,
store_status,
store_wallet,
});
});
this.setState({
dataSources,
isLoading: false,
});
}
onCollectionUpdate = (querySnapshot) => {
const dataSource = [];
querySnapshot.forEach((doc) => {
const { Name,
OrderId,
OrderStatus,
PaymentMetod,
StoreID,
Timestamp,
UserID,
Address,
Contact,
DateOrdered,
} = doc.data();
dataSource.push({
key: doc.id,
doc, // DocumentSnapshot
Name,
OrderId,
OrderStatus,
PaymentMetod,
StoreID,
Timestamp,
UserID,
Address,
Contact,
DateOrdered,
});
});
this.setState({
dataSource,
isLoading: false,
});
}
render() {
if (this.state.isLoading) {
return (
<View style={{flex: 1, paddingTop: 20}}>
<ActivityIndicator size="large" color="#00ff00" style={{ flex: 1,
justifyContent: "center", flexDirection: "row",
justifyContent: "space-around",
padding: 10}}/>
</View>
);
}
return (
<View style={styles.container}><FlatList
data={ this.state.dataSources }
renderItem={({item}) =>
<TouchableOpacity style={{backgroundColor: 'white',
shadowColor: 'rgba(107, 0, 0, 0.1)',
shadowOpacity: 1,
shadowRadius: 10,
shadowOffset: {
height: 10,
width: 0,
},
elevation: 8,
alignContent: 'center',
// Ignore these
width: '100%',
height: 60,}}>
<Text style={{fontWeight: "bold", paddingLeft: 35,fontSize: 22 }}>REMAINING BALANCE: {item.store_wallet} </Text>
<Text style={{ paddingLeft: 120}}>{item.store_name} - {item.store_status}</Text>
</TouchableOpacity>
}
keyExtractor={item => item.order_id}
/>
<FlatList
data={ this.state.dataSource }
renderItem={({item}) =>
<TouchableOpacity style={styles.cardContainer} onPress={() => Actions.orderdetail({order: item})}>
<Text style={{fontWeight: "bold", paddingLeft: 5 }}>{item.Name} - {item.DateOrdered} ({item.OrderStatus})</Text>
<Text style={{ padding: 5}}>{item.OrderId}</Text>
<Text style={{ padding: 5}}>{item.Address}</Text>
</TouchableOpacity>
}
keyExtractor={item => item.order_id}
/>
</View>
);
}
}
const styles = StyleSheet.create({
MainContainer :{
flex:1,
paddingTop: 30,
backgroundColor: '#fff'
},
MainContainer_For_Show_StudentList_Activity :{
flex:1,
paddingTop: (Platform.OS == 'ios') ? 20 : 0,
marginLeft: 5,
marginRight: 5
},
TextInputStyleClass: {
textAlign: 'center',
width: '90%',
marginBottom: 7,
height: 40,
borderWidth: 1,
borderColor: '#FF5722',
borderRadius: 5 ,
},
TouchableOpacityStyle: {
paddingTop:10,
paddingBottom:10,
borderRadius:5,
marginBottom:7,
width: '90%',
backgroundColor: '#00BCD4'
},
TextStyle:{
color:'#fff',
textAlign:'center',
},
rowViewContainer: {
fontSize: 20,
paddingRight: 10,
paddingTop: 10,
paddingBottom: 10,
},
container: {
flex: 1,
padding: 2,
backgroundColor: '#E5E5E5',
},
cardContainer: {
// Play with these
// https://facebook.github.io/react-native/docs/view-style-props
// https://facebook.github.io/react-native/docs/shadow-props
backgroundColor: 'white',
margin: 5,
borderRadius: 12,
shadowColor: 'rgba(107, 87, 140, 0.1)',
shadowOpacity: 1,
shadowRadius: 16,
shadowOffset: {
height: 10,
width: 0,
},
elevation: 8,
// Ignore these
width: '100%',
height: 90,
},
imageView: {
margin:5,
width: '30%',
height: 50 ,
},
textView: {
width:'50%',
padding:10,
color: '#000'
}
});