The action 'NAVIGATE' with payload {"name":"Home","params":{"user":{"id":"VUUpROQPtKaXVef15e5XhxXNLrm1","email":"[email protected]","fullName":"snertp0"}}} was not handled by any navigator.
Do you have a screen named 'Home'?
I have this problem when I try to log in or register, I don't know how to solve it. I have tried several ways that I have found but I can't find the solution, Thank you!
This is all the code I use, so I don't understand why you tell me there is no Screen Home, if I am using it. I've been checking several times all the code but I can't find where that fault may be, since I think I'm calling it all correctly.
LoginScreen
import React, {useState} from 'react';
import {Image, Text, TextInput, TouchableOpacity, View} from 'react-native';
import {KeyboardAwareScrollView} from 'react-native-keyboard-aware-scroll-view';
import {app} from '../firebase/DataBaseConfig';
import HomeScreen from './HomeScreen';
export default function LoginScreen({navigation}) {
const [email, setEmail] = useState('');
const [password, setPassword] = useState('');
const onFooterLinkPress = () => {
navigation.navigate('Registration');
};
const onLoginPress = () => {
app
.auth()
.signInWithEmailAndPassword(email, password)
.then((response) => {
const uid = response.user.uid;
const usersRef = app.firestore().collection('users');
usersRef
.doc(uid)
.get()
.then((firestoreDocument) => {
if (!firestoreDocument.exists) {
alert('User does not exist anymore.');
return;
}
const user = firestoreDocument.data();
navigation.navigate("HomeScreen", {user});
})
.catch((error) => {
alert(error);
});
})
.catch((error) => {
alert(error);
});
};
return (
<KeyboardAwareScrollView
style={{flex: 1, width: '100%'}}
keyboardShouldPersistTaps="always">
<TextInput
placeholder="E-mail"
placeholderTextColor="#aaaaaa"
onChangeText={(text) => setEmail(text)}
value={email}
underlineColorAndroid="transparent"
autoCapitalize="none"
/>
<TextInput
placeholderTextColor="#aaaaaa"
secureTextEntry
placeholder="Password"
onChangeText={(text) => setPassword(text)}
value={password}
underlineColorAndroid="transparent"
autoCapitalize="none"
/>
<TouchableOpacity onPress={() => onLoginPress()}>
<Text>Log in</Text>
</TouchableOpacity>
<View>
<Text>
Don't have an account?{' '}
<Text onPress={onFooterLinkPress}>Sign up</Text>
</Text>
</View>
</KeyboardAwareScrollView>
);
}
App.js
import React, {useEffect, useState} from 'react';
import {NavigationContainer} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';
import LoginScreen from './ponents/screens/LoginScreen';
import HomeScreen from './ponents/screens/HomeScreen';
import RegistrationScreen from './ponents/screens/RegistrationScreen';
import {decode, encode} from 'base-64';
import {firebase} from './ponents/firebase/DataBaseConfig';
if (!global.btoa) {
global.btoa = encode;
}
if (!global.atob) {
global.atob = decode;
}
const Stack = createStackNavigator();
export default function App() {
const [loading, setLoading] = useState(true);
const [user, setUser] = useState(null);
return (
<NavigationContainer>
<Stack.Navigator>
{user ? (
<Stack.Screen name="HomeScreen">
{(props) => <HomeScreen {...props} extraData={user} />}
</Stack.Screen>
) : (
<>
<Stack.Screen name="Login" ponent={LoginScreen} />
<Stack.Screen name="Registration" ponent={RegistrationScreen} />
</>
)}
</Stack.Navigator>
</NavigationContainer>
);
if (loading) {
return <></>;
}
useEffect(() => {
const usersRef = firebase.firestore().collection('users');
firebase.auth().onAuthStateChanged((user) => {
if (user) {
usersRef
.doc(user.uid)
.get()
.then((document) => {
const userData = document.data();
setLoading(false);
setUser(userData);
})
.catch((error) => {
setLoading(false);
});
} else {
setLoading(false);
}
});
}, []);
}
HomeScreen
import React, {useEffect, useState} from 'react';
import {
FlatList,
Keyboard,
Text,
TextInput,
TouchableOpacity,
View,
} from 'react-native';
import styles from '../styles/styles';
import {firebase} from '../../ponents/firebase/DataBaseConfig';
export default function HomeScreen(props) {
const [entityText, setEntityText] = useState('');
const [entities, setEntities] = useState([]);
const entityRef = firebase.firestore().collection('entities');
const userID = props.extraData.id;
useEffect(() => {
entityRef
.where('authorID', '==', userID)
.orderBy('createdAt', 'desc')
.onSnapshot(
(querySnapshot) => {
const newEntities = [];
querySnapshot.forEach((doc) => {
const entity = doc.data();
entity.id = doc.id;
newEntities.push(entity);
});
setEntities(newEntities);
},
(error) => {
console.log(error);
},
);
}, []);
const onAddButtonPress = () => {
if (entityText && entityText.length > 0) {
const timestamp = firebase.firestore.FieldValue.serverTimestamp();
const data = {
text: entityText,
authorID: userID,
createdAt: timestamp,
};
entityRef
.add(data)
.then((_doc) => {
setEntityText('');
Keyboard.dismiss();
})
.catch((error) => {
alert(error);
});
}
};
const renderEntity = ({item, index}) => {
return (
<View style={styles.entityContainer}>
<Text style={styles.entityText}>
{index}. {item.text}
</Text>
</View>
);
};
return (
<View style={styles.container}>
<View style={styles.formContainer}>
<TextInput
style={styles.input}
placeholder="Add new entity"
placeholderTextColor="#aaaaaa"
onChangeText={(text) => setEntityText(text)}
value={entityText}
underlineColorAndroid="transparent"
autoCapitalize="none"
/>
<TouchableOpacity style={styles.button} onPress={onAddButtonPress}>
<Text style={styles.buttonText}>Add</Text>
</TouchableOpacity>
</View>
{entities && (
<View style={styles.listContainer}>
<FlatList
data={entities}
renderItem={renderEntity}
keyExtractor={(item) => item.id}
removeClippedSubviews={true}
/>
</View>
)}
</View>
);
}´´´
The action 'NAVIGATE' with payload {"name":"Home","params":{"user":{"id":"VUUpROQPtKaXVef15e5XhxXNLrm1","email":"[email protected]","fullName":"snertp0"}}} was not handled by any navigator.
Do you have a screen named 'Home'?
I have this problem when I try to log in or register, I don't know how to solve it. I have tried several ways that I have found but I can't find the solution, Thank you!
This is all the code I use, so I don't understand why you tell me there is no Screen Home, if I am using it. I've been checking several times all the code but I can't find where that fault may be, since I think I'm calling it all correctly.
LoginScreen
import React, {useState} from 'react';
import {Image, Text, TextInput, TouchableOpacity, View} from 'react-native';
import {KeyboardAwareScrollView} from 'react-native-keyboard-aware-scroll-view';
import {app} from '../firebase/DataBaseConfig';
import HomeScreen from './HomeScreen';
export default function LoginScreen({navigation}) {
const [email, setEmail] = useState('');
const [password, setPassword] = useState('');
const onFooterLinkPress = () => {
navigation.navigate('Registration');
};
const onLoginPress = () => {
app
.auth()
.signInWithEmailAndPassword(email, password)
.then((response) => {
const uid = response.user.uid;
const usersRef = app.firestore().collection('users');
usersRef
.doc(uid)
.get()
.then((firestoreDocument) => {
if (!firestoreDocument.exists) {
alert('User does not exist anymore.');
return;
}
const user = firestoreDocument.data();
navigation.navigate("HomeScreen", {user});
})
.catch((error) => {
alert(error);
});
})
.catch((error) => {
alert(error);
});
};
return (
<KeyboardAwareScrollView
style={{flex: 1, width: '100%'}}
keyboardShouldPersistTaps="always">
<TextInput
placeholder="E-mail"
placeholderTextColor="#aaaaaa"
onChangeText={(text) => setEmail(text)}
value={email}
underlineColorAndroid="transparent"
autoCapitalize="none"
/>
<TextInput
placeholderTextColor="#aaaaaa"
secureTextEntry
placeholder="Password"
onChangeText={(text) => setPassword(text)}
value={password}
underlineColorAndroid="transparent"
autoCapitalize="none"
/>
<TouchableOpacity onPress={() => onLoginPress()}>
<Text>Log in</Text>
</TouchableOpacity>
<View>
<Text>
Don't have an account?{' '}
<Text onPress={onFooterLinkPress}>Sign up</Text>
</Text>
</View>
</KeyboardAwareScrollView>
);
}
App.js
import React, {useEffect, useState} from 'react';
import {NavigationContainer} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';
import LoginScreen from './ponents/screens/LoginScreen';
import HomeScreen from './ponents/screens/HomeScreen';
import RegistrationScreen from './ponents/screens/RegistrationScreen';
import {decode, encode} from 'base-64';
import {firebase} from './ponents/firebase/DataBaseConfig';
if (!global.btoa) {
global.btoa = encode;
}
if (!global.atob) {
global.atob = decode;
}
const Stack = createStackNavigator();
export default function App() {
const [loading, setLoading] = useState(true);
const [user, setUser] = useState(null);
return (
<NavigationContainer>
<Stack.Navigator>
{user ? (
<Stack.Screen name="HomeScreen">
{(props) => <HomeScreen {...props} extraData={user} />}
</Stack.Screen>
) : (
<>
<Stack.Screen name="Login" ponent={LoginScreen} />
<Stack.Screen name="Registration" ponent={RegistrationScreen} />
</>
)}
</Stack.Navigator>
</NavigationContainer>
);
if (loading) {
return <></>;
}
useEffect(() => {
const usersRef = firebase.firestore().collection('users');
firebase.auth().onAuthStateChanged((user) => {
if (user) {
usersRef
.doc(user.uid)
.get()
.then((document) => {
const userData = document.data();
setLoading(false);
setUser(userData);
})
.catch((error) => {
setLoading(false);
});
} else {
setLoading(false);
}
});
}, []);
}
HomeScreen
import React, {useEffect, useState} from 'react';
import {
FlatList,
Keyboard,
Text,
TextInput,
TouchableOpacity,
View,
} from 'react-native';
import styles from '../styles/styles';
import {firebase} from '../../ponents/firebase/DataBaseConfig';
export default function HomeScreen(props) {
const [entityText, setEntityText] = useState('');
const [entities, setEntities] = useState([]);
const entityRef = firebase.firestore().collection('entities');
const userID = props.extraData.id;
useEffect(() => {
entityRef
.where('authorID', '==', userID)
.orderBy('createdAt', 'desc')
.onSnapshot(
(querySnapshot) => {
const newEntities = [];
querySnapshot.forEach((doc) => {
const entity = doc.data();
entity.id = doc.id;
newEntities.push(entity);
});
setEntities(newEntities);
},
(error) => {
console.log(error);
},
);
}, []);
const onAddButtonPress = () => {
if (entityText && entityText.length > 0) {
const timestamp = firebase.firestore.FieldValue.serverTimestamp();
const data = {
text: entityText,
authorID: userID,
createdAt: timestamp,
};
entityRef
.add(data)
.then((_doc) => {
setEntityText('');
Keyboard.dismiss();
})
.catch((error) => {
alert(error);
});
}
};
const renderEntity = ({item, index}) => {
return (
<View style={styles.entityContainer}>
<Text style={styles.entityText}>
{index}. {item.text}
</Text>
</View>
);
};
return (
<View style={styles.container}>
<View style={styles.formContainer}>
<TextInput
style={styles.input}
placeholder="Add new entity"
placeholderTextColor="#aaaaaa"
onChangeText={(text) => setEntityText(text)}
value={entityText}
underlineColorAndroid="transparent"
autoCapitalize="none"
/>
<TouchableOpacity style={styles.button} onPress={onAddButtonPress}>
<Text style={styles.buttonText}>Add</Text>
</TouchableOpacity>
</View>
{entities && (
<View style={styles.listContainer}>
<FlatList
data={entities}
renderItem={renderEntity}
keyExtractor={(item) => item.id}
removeClippedSubviews={true}
/>
</View>
)}
</View>
);
}´´´
Share
Improve this question
edited Nov 17, 2020 at 16:43
Jose
asked Nov 16, 2020 at 18:32
JoseJose
331 gold badge1 silver badge4 bronze badges
2 Answers
Reset to default 3in your App.js, you have the following:
<Stack.Screen name="Home">
{(props) => <HomeScreen {...props} extraData={user} />}
</Stack.Screen>
it should be
<Stack.Screen name="HomeScreen">
{(props) => <HomeScreen {...props} extraData={user} />}
</Stack.Screen>
then you need to make the following changes to the navigator:
return (
<NavigationContainer>
<Stack.Navigator initialRouteName={user ? 'HomeScreen' : 'Login'}>
<Stack.Screen name="HomeScreen">
{(props) => <HomeScreen {...props} extraData={user} />}
</Stack.Screen>
<Stack.Screen name="Login" ponent={LoginScreen} />
<Stack.Screen name="Registration" ponent={RegistrationScreen} />
)}
</Stack.Navigator>
</NavigationContainer>
);
on your login screen change
navigation.navigate(HomeScreen, {user});
to
navigation.navigate("HomeScreen", {user});
发布者:admin,转转请注明出处:http://www.yc00.com/questions/1742341080a4425640.html
评论列表(0条)