负载为{“name”:“homescreen”,“params”:……}的操作“navigate”未由任何导航器处理你有一个叫“主页”的屏幕吗?

f3temu5u  于 2021-07-08  发布在  Java
关注(0)|答案(2)|浏览(277)

使用有效负载{“name”:“home”,“params”:{“user”:{“id”:“vuuproqptkaxvef15e5xhxxnlrm1”,“email”:“导航”操作anto22e@gmail.com“,”fullname“:”snertp0“}}}未由任何导航器处理。
你有一个叫“主页”的屏幕吗?
我有这个问题,当我试图登录或注册,我不知道如何解决它。我已经试过好几种方法,但我找不到解决办法,谢谢!
这是所有我使用的代码,所以我不明白为什么你告诉我没有屏幕主页,如果我正在使用它。我已经检查了好几次所有的代码,但我找不到错误可能在哪里,因为我认为我调用它都是正确的。
登录屏幕

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>
  );
}

应用程序.js

import React, {useEffect, useState} from 'react';
import {NavigationContainer} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';
import LoginScreen from './components/screens/LoginScreen';
import HomeScreen from './components/screens/HomeScreen';
import RegistrationScreen from './components/screens/RegistrationScreen';
import {decode, encode} from 'base-64';
import {firebase} from './components/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" component={LoginScreen} />
            <Stack.Screen name="Registration" component={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);
      }
    });
  }, []);
}

主屏幕

import React, {useEffect, useState} from 'react';
import {
FlatList,
Keyboard,
Text,
TextInput,
TouchableOpacity,
View,
} from 'react-native';
import styles from '../styles/styles';
import {firebase} from '../../components/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>
);
}´´´
stszievb

stszievb1#

在app.js中,您有以下内容:

<Stack.Screen name="Home">
        {(props) => <HomeScreen {...props} extraData={user} />}
      </Stack.Screen>

应该是的

<Stack.Screen name="HomeScreen">
        {(props) => <HomeScreen {...props} extraData={user} />}
      </Stack.Screen>

然后需要对导航器进行以下更改:

return (
    <NavigationContainer>
      <Stack.Navigator initialRouteName={user ? 'HomeScreen' : 'Login'}>
          <Stack.Screen name="HomeScreen">
            {(props) => <HomeScreen {...props} extraData={user} />}
          </Stack.Screen>
            <Stack.Screen name="Login" component={LoginScreen} />
            <Stack.Screen name="Registration" component={RegistrationScreen} />
        )}
      </Stack.Navigator>
    </NavigationContainer>
  );
rn0zuynd

rn0zuynd2#

在登录屏幕上更改

navigation.navigate(HomeScreen, {user});

navigation.navigate("HomeScreen", {user});

相关问题