React Native：使用有效负载导航的操作未由任何导航器处理

Question

验证电子邮件和密码后，我正在尝试从登录屏幕导航到个人资料屏幕。 其他一切都有效。我能够从 auth api 获取令牌，存储它并检索它。 之后我无法导航到下一个屏幕，这会引发错误

这是我的代码：

更新：根据答案。我纠正了拼写错误。现在可以了！！

import * as React from 'react';
import { useState } from 'react';
import { ActivityIndicator, StatusBar, StyleSheet, TextInput, TouchableOpacity, Image, TouchableHighlight } from 'react-native';
import { Text, View } from '../components/Themed';
import * as SecureStore from 'expo-secure-store';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
import { createDrawerNavigator } from '@react-navigation/drawer';
import navigation from '../navigation';

export default function LoginScreen({navigation}) {
  const [email, setEmail] = useState("");
  const [password, setPassword] = useState("");
  const [data, setData] = useState([]);

  const doUserLogIn = async() => {
    try {
      const response = await fetch('http://some-server.de/api/login/?email='+email+'&password='+password, {
        method: 'POST',
        headers: {
          Accept: 'application/json',
          'Content-Type': 'application/json'
        }
      });
      const json = await response.json();
      setData(json);
    } catch (e) {
      console.log('Error1:'+e);
    } finally {
      try{
        await SecureStore.setItemAsync('token', JSON.stringify(data.token));
        navigation.navigate('Profile');
      } catch(e) {alert('Error2:'+e); }
    }
  }
  return (
    <View  style={styles.container}>
    <StatusBar style="auto" />
    <View style={styles.inputView}>
      <TextInput
        placeholder="Email."
        onChangeText={(email) => setEmail(email)}
      />
    </View>

    <View style={styles.inputView}>
      <TextInput
        placeholder="Passwort."
        onChangeText={(password) => setPassword(password)}
      />
    </View>

    <TouchableOpacity style={styles.loginBtn} onPress={() => doUserLogIn()}>
      <Text style={styles.loginText}>Anmelden</Text>
    </TouchableOpacity>
    </View>
  );
}

下面是我的抽屉导航的代码：

const Drawer = createDrawerNavigator();

function RootNavigator() {
  return (
    <Drawer.Navigator initialRouteName="Home">
      <Drawer.Screen name="Anmelden" component={LoginScreen} />
      <Drawer.Screen name="Profil" component={ProfileScreen} />
      <Drawer.Screen name="Schichten" component={ShiftsScreen} />
      <Drawer.Screen name="Arbeitszeitbericht" component={TimelogScreen} />
    </Drawer.Navigator>
  );
}`

Answer 1

错误意味着“个人资料”与当前页面不在同一个屏幕堆栈中。如果您的堆栈由“登录”分隔，那么您的登录堆栈将无法访问您的“登录”堆栈。您可以设置一个条件：

userLoggedIn ? LoggedInStack : LoginStack

所以当用户登录时，它会自动切换到 LoggedInStack，它将“Profile”作为它的第一个屏幕，所以它直接进入那里。