如何从内部组件 React Native 调用 App.js？

Question

我正在使用 StackNavigator 加载在 App.js 中使用 react-native-tab-navigator 创建的 Tabbar。我在 Tabbar 里面有一个视图。如何从该视图导航回 App.js？

App.js

import { StackNavigator } from 'react-navigation';

const SigninSignup = StackNavigator({
  Signup: { screen: Signup },
  Signin: { screen: Signin },
});

 render() {
        if (this.state.condition) {
          return (<Tabbar />);
        } else {
          return (<SigninSignup />);
        }
    }

Myview.js（在Tabbar里面）

如何返回 App.js 并加载 SigninSignup？

我试过了

 const { navigate } = this.props.navigation;
 navigate('Signin', {});

但是出现错误 undefined is not an object (evaluating 'this.props.navigation')

Answer 1

您的导航层次结构从 SigninSignup 导航器开始。

由于您的组件根据 this.state.condition 呈现导航器或标签栏，您不能 navigate 到另一个屏幕。

你可以解决这个问题，要么将标签栏和 SigninSignup 导航器移动到新的根导航器中，并使用它在所有内容之间导航，要么为 Tabbar 提供一个会改变的功能condition 的值：

<Tabbar onSomething={() => this.setState({condition: !this.state.condition})} />

如何从内部组件 React Native 调用 App.js？

How to invoke App.js from inner component ReactNative?

react-native

react-navigation