【问题标题】:Can not navigate to another screen with navigation.navigate无法使用 navigation.navigate 导航到另一个屏幕
【发布时间】:2020-04-20 03:28:15
【问题描述】:

我有一个带有函数的类登录:

  async _logInWithFacebook() {
    await Facebook.initializeAsync(fbConfig.APP_ID);
    const { type, token } = await Facebook.logInWithReadPermissionsAsync(
      fbConfig.APP_ID,
      {
        permissions: ["public-profile", "email"],
      }
    );
    if (type === "success") {
      this.props.login(token, "facebook");
      this.props.navigation.navigate("Home");
    } else {
      throw new Error("Something wrong with facebook auth");
    }
  }

当我按下按钮登录时调用它。我还有一个 HomeScreen 类,按下按钮后我想在其中移动。

class HomeScreen extends Component {
  componentDidMount() {
    this.props.fetchMyMeetups();
  }
  render() {
    const {
      myMeetups: { isFetched, data, error },
    } = this.props;
    return (
      <View style={styles.root}>
        <View style={styles.header}>
          <View style={styles.add}>
            <CreateMeetupScreen />
          </View>
        </View>
        <View style={styles.topContainer}>
          <Text>HomeScreen</Text>
        </View>
        <View style={styles.bottomContainer}>
          <MyMeetupsList meetups={data} />
        </View>
      </View>
    );
  }
}
export default HomeScreen;

还有我的导航器:

export function Navigator() {
  return (
    <NavigationContainer>
      <Stack.Navigator initialRouteName="Login">
        <Stack.Screen name="Login" component={LoginScreen} />
        <Stack.Screen name="Home" component={HomeScreen} />
      </Stack.Navigator>
    </NavigationContainer>
  );

所以当我按下按钮时出现错误:[未处理的承诺拒绝:TypeError: undefined is not an object (evalating '_ref.navigation')]

【问题讨论】:

    标签: reactjs react-native react-redux


    【解决方案1】:

    在开始时,控制台在每个组件中记录您的道具并检查您是否在上面导航,然后不要忘记将您想要传递到下一个屏幕的道具作为导航功能的第二项传递,例如

    this.props.navigation.navigate("Home",{SOME PROPS HERE});
    

    然后您就可以在下一页中获取并使用它。 希望对你有帮助

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-12-30
      • 1970-01-01
      • 2021-11-09
      • 2010-11-09
      • 2019-10-20
      • 1970-01-01
      相关资源
      最近更新 更多