带有负载 {"name":"Home"} 的操作 'NAVIGATE' 没有被任何导航器处理

Question

当前行为获取错误

React Native 中的私有路由无法处理页面更改。任何导航器均未处理负载为 {"name":"Home"} 的操作 'NAVIGATE'。你有一个名为 'Home' 的屏幕吗？

如果您尝试导航到嵌套导航器中的屏幕，请参阅 https://reactnavigation.org/docs/nesting-navigators#navigating-to-a-screen-in-a-nested-navigator。

这是一个仅限开发的警告，不会在生产中显示。

预期行为无法使用身份验证流程进行导航。

如何重现使用的代码来自：https://reactnavigation.org/docs/auth-flow

<NavigationContainer>
        <Stack.Navigator
          screenOptions={{
            headerShown: false,
          }}>
           {isSignedIn === "true"? ( 
            <> 
            <Stack.Screen name="Home" component={Home} />
            <Stack.Screen name="Bookorder" component={Bookorder} />
             </> 
           ) : (
            <>
            <Stack.Screen name="Login" component={Login} />
            </>
          )}
        </Stack.Navigator>
  </NavigationContainer>

环境系统： OS: macOS 10.15.4 CPU：(4) x64 Intel(R) Core(TM) i5-5350U CPU @ 1.80GHz 内存：46.17 MB / 8.00 GB Shell：3.2.57 - /bin/bash 二进制文件：节点：13.12.0 - /usr/local/bin/node 纱线：未找到 npm：6.14.4 - /usr/local/bin/npm 守望者：4.9.0 - /usr/local/bin/watchman

Answer 1

我得到了一个临时解决方案：

import React, {Component} from 'react';
import {Provider} from 'react-redux';
import configureStore from './redux/store/Store';
import {View} from 'react-native';
import {NavigationContainer} from '@react-navigation/native';
import {
  createStackNavigator,
  CardStyleInterpolators,
} from '@react-navigation/stack';
import HomeRoot from './appRoot/HomeRoot';
import AuthRoot from './appRoot/AuthRoot';
import LocalStorage from './common/LocalStorage';
import {Root} from 'native-base'; //for toast
const store = configureStore();

const RootStack = createStackNavigator();

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      isLogin: false,
      isCheckLogin: false,
    };
  }

  setLoginState = async () => {
    let isLogin = await LocalStorage.read('isLogin');
    this.setState({isLogin: isLogin, isCheckLogin: true});
  };

  componentDidMount = async () => {
    await this.setLoginState();
  };

  render() {
    const {isLogin, isCheckLogin} = this.state;
    if (!isCheckLogin) {
      return <View />;
    }

    return (
      <Provider store={store}>
        <Root>
          <NavigationContainer>
            <RootStack.Navigator
              initialRouteName="Home"
              headerMode="none"
              screenOptions={{
                gestureEnabled: false,
                cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS,
              }}>
              {isLogin ? (
                <>
                  <RootStack.Screen
                    initialParams={{setLogin: this.setLoginState()}}
                    name="Home"
                    component={HomeRoot}
                  />
                </>
              ) : (
                <>
                  <RootStack.Screen
                    initialParams={{setLogin: this.setLoginState()}}
                    name="Login"
                    component={AuthRoot}
                  />
                </>
              )}
            </RootStack.Navigator>
          </NavigationContainer>
        </Root>
      </Provider>
    );
  }
}
export default App;

带有负载 {"name":"Home"} 的操作 'NAVIGATE' 没有被任何导航器处理

The action 'NAVIGATE' with payload {"name":"Home"} was not handled by any navigator

react-native

react-navigation

react-navigation-stack