我对本机和Firebase有问题。我在代码上遇到了一些困难,因为在我的应用程序中,我想打印两个屏幕:一个是排行榜,我在其中打印所有用户的所有数据,另一个是排行榜,在UserInfo中,我仅打印以下数据:当前用户,但我什么也没看到,因为我认为currentUID有问题,但是我不知道在哪里。
这里是我代码的直接链接 https://snack.expo.io/@khal_d/proj-p-3
我认为这是关于register.js和User.js的问题
import React, { Component } from 'react';
import {
View,
TouchableOpacity,
StyleSheet,
Button,
Text,
Image,
ScrollView,
Alert,KeyboardAvoidingView,
} from 'react-native';
import { Input, Card, Divider } from 'react-native-elements';
import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
import { ImagePicker, Permissions } from 'expo';
import * as firebase from 'firebase';
export default class RegisterScreen extends Component {
static navigationOptions = {
title: 'Registration',
};
state = {
isLoading: 'false',
email: '',
password: '',
utente: '',
name: '',
surname: '',
image: '',
error: '',
data: [],
};
componentDidMount(){
//leggere array dal db
const uid = firebase.auth().currentUser.uid;
console.log("udi: " + uid)
this.uid= uid;
if(uid) {
firebase.database()
.ref("/users/"+ uid)
.on("value", snap => {
let data = [];
snap.forEach(child => {
data.push({
id:child.key,
...child.val()
});
});
this.setState({data});
})
}
}
_signUp = () => {
this.setState({ isLoading: true });
firebase
.auth()
.createUserWithEmailAndPassword(this.state.email, this.state.password)
.then(user => {
this.setState({ isLoading: false });
this.props.navigation.navigate();
})
.catch(error => {
this.setState({ isLoading: false, error: error.message });
});
const uid = firebase.auth().currentUser.uid;
// console.log("Il current UID dell'utente e':" + currentUID);
if (uid) {
// firebase.database().ref(path).on('value', snap => console.log(snap.val()))
const users = {
email: this.state.email,
surname: this.state.surname,
name: this.state.name,
image: this.state.image,
};
firebase
.database()
.ref( "users/")
.push(users);
}
};
_scrollToInput(reactNode: any) {
// Add a 'scroll' ref to your ScrollView
this.scroll.props.scrollToFocusedInput(reactNode);
}
render() {
let { image } = this.state;
return (
<KeyboardAvoidingView behavior="padding" style={styles.container}>
<ScrollView style={{flex: 1}}>
<Card>
<Button
title="Pick an image from PhotooGallery"
onPress={() => {
console.log('Pick image');
}}
/>
<Image
source={{ uri: image }}
style={{ width: 200, height: 200 }}
/>
</Card>
<Card>
<Input
label="E-Mail"
placeholder="enter a valid email"
onChangeText={text => this.setState({ email: text })}
/>
<Input
label="Name"
placeholder="enter your name"
onChangeText={text => this.setState({ name: text })}
/>
<Input
label="Surname"
placeholder="enter your surname"
onChangeText={text => this.setState({ surname: text })}
/>
<Input
secureTextEntry
label="password"
placeholder="your password"
onChangeText={text => this.setState({ password: text })}
/>
</Card>
<Card>
<Button onPress={this._signUp} title="Register" color="#640584" />
</Card>
</ScrollView>
</KeyboardAvoidingView>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
},
});
这是用户
import React, { Component } from 'react';
import { View, TouchableOpacity, StyleSheet, Button, Text, ScrollView } from 'react-native';
import { Input, Card, ListItem} from 'react-native-elements';
import * as firebase from 'firebase';
export default class User extends Component {
static navigationOptions = {
title: 'UserInfo',
};
state = {
data: [],
};
// Controllare qui
componentDidMount(){
//leggere array dal db
const currentUID = firebase.auth().currentUser.uid;
const path ="/users/" + currentUID;
const users = firebase.database().ref(path);
users.on("value", snap => {
console.log("log di snap" + snap);
//ciclo
var elenco = [];
snap.forEach(child => {
elenco.push({
name: child.val().name,
surname: child.val().surname,
email: child.val().email,
image: child.val().image,
})
});
console.log("altro log finale" + elenco);
this.setState({data:elenco})
});
}
render() {
return (
<ScrollView>
<View>
<Card>
{ this.state.data &&
this.state.data.map((l, i) => (
<ListItem
key={i}
leftAvatar={{ source: { uri: l.image } }}
title={l.name}
subtitle={l.surname}
/>
))
}
</Card>
</View>
</ScrollView>
);
}
}