-
Notifications
You must be signed in to change notification settings - Fork 0
/
App.js
84 lines (73 loc) · 2.13 KB
/
App.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
import { StatusBar } from "expo-status-bar";
import { StyleSheet, Text, View, TouchableOpacity } from "react-native";
import "@react-native-firebase/app";
import firestore from "@react-native-firebase/firestore";
import { useEffect, useState } from "react";
// set the host and the port property to connect to the emulator
// set these before any read/write operations occur to ensure it doesn't affect your Cloud Firestore data!
firestore().useEmulator("localhost", 8080);
const db = firestore();
const Button = ({ label, onPress }) => (
<TouchableOpacity style={styles.buttonContainer} onPress={onPress}>
<Text style={styles.buttonText}>{label}</Text>
</TouchableOpacity>
);
export default function App() {
const [users, setUsers] = useState([{ name: "etevlao2" }]);
useEffect(() => {
db.collection("teste2").onSnapshot((querySnapshot) => {
const newUsers = [];
querySnapshot.forEach((documentSnapshot) => {
newUsers.push(documentSnapshot.data());
});
console.log(newUsers);
setUsers(newUsers);
});
}, []);
return (
<View style={styles.container}>
<Text>Open up App.js to start working on your app232!</Text>
<Button
label="insert"
onPress={() => {
db.collection("teste2").add({
name: "Tesssssss222",
});
db.collection("teste3").add({
name: "Tesssssss222",
});
db.collection("teste4").add({
name: "Tesssssss222",
});
db.collection("teste5").add({
name: "Tesssssss222",
});
}}
/>
{users.map((user, index) => {
return user && <Text key={index}>{user.name}</Text>;
})}
<StatusBar style="auto" />
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#fff",
alignItems: "center",
justifyContent: "center",
},
buttonContainer: {
backgroundColor: "#4630eb",
borderRadius: 4,
padding: 12,
marginVertical: 10,
justifyContent: "center",
alignItems: "center",
},
buttonText: {
color: "#ffffff",
fontSize: 16,
},
});