类型错误:没有“路由"在导航状态找到

问题描述

我正在使用 react-navigation 中的 createMaterialTopTabNavigator，其中我有两个单独的屏幕 UpdatesStack 和 ShopsStack，我想导航到其他屏幕从这些屏幕，所以我写的像 <Toptab navigation={this.props.navigation}/> 并且它显示我跟随红屏错误.

I am using createMaterialTopTabNavigator from react-navigation in which i have two separate screens UpdatesStack and ShopsStack and i want to navigate to other screen from these screens so i written like <Toptab navigation={this.props.navigation} /> and it showing me following red screen error.

如果我像 <Toptab/> 这样写，那么没有错误，但我无法导航.

And if i write like <Toptab /> then there is no error but i am not able to navigate.

那么我该如何解决这个问题并能够导航.

so how can i solve this problem and able to navigate.

代码

class Parenthome extends Component {
  render() {
    const { navigate } = this.props.navigation;
    return (
      <View style={styles.container}>
        <ToolbarAndroid
          style={styles.toolbar}
          title="Toolbar"
          titleColor="#ff6600"
        />

        <Toptab navigation={this.props.navigation} />
      </View>
    );
  }
}

const UpdatesStack = createStackNavigator(
  {
    Updates: { screen: Home }
  },
  {
    initialRouteName: "Updates"
  }
);

const ShopsStack = createStackNavigator(
  {
    Shops: { screen: Conshop }
  },
  {
    initialRouteName: "Shops"
  }
);

const Toptab = createMaterialTopTabNavigator({
  Updatestab: { screen: UpdatesStack },
  Shopstab: { screen: ShopsStack }
});

export default Parenthome;

推荐答案

我知道现在已经晚了，但只是为了回答那些从搜索引擎偶然发现这个问题的人:

I know it's late but just to answer for those who stumble on this from Search Engines:

1. 为什么不导出默认的 TopTab 本身.在您的用例中似乎没有必要用 ParentTheme 组件包装 TopTab.您可以设置 TopTab 导航器本身的样式并像任何其他组件一样呈现它.

1. Why don't you export default TopTab itself. There seems no need to wrap TopTab with ParentTheme component in your use case. You can style the TopTab navigator itself and render it like any other component.

如果您必须包装 TopTab，除了导航道具之外，您还需要从 TopTab 访问路由器.这样它们都指向同一个路由器.简单来说，在ParentTheme中添加:

If you must wrap the TopTab you need to have the router from the TopTab accessible, in addition to the navigation prop. This way they both refer to the same router. Simply put, add in ParentTheme:

静态路由器 = TopTab.router;

static router = TopTab.router;

查看自定义导航器了解更多信息.https://reactnavigation.org/docs/en/custom-navigators.html

Check out Custom Navigators for more info. https://reactnavigation.org/docs/en/custom-navigators.html

这篇关于类型错误:没有“路由"在导航状态找到的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！