2

我想在我的 react-native 应用程序中将顶部选项卡添加到我的屏幕之一。我正在使用 react-native-navigation 进行导航。我可以使用 Navigation.startTabBasedApp 中定义的任何屏幕轻松访问它，这意味着任何屏幕也是我的底部选项卡之一。

我想要屏幕上的顶部选项卡不是底部选项卡之一。这是我现在尝试做的方式

Navigation.startSingleScreenApp({
    screen: {
      screen: 'screen',
      title: 'screen'
    },
    TopTabRootScreen: {
      screen: 'ToptabRoot',
      title: 'ToptabRoot',
      navigatorStyle: {},
      topTabs: [
        {
          screenId: 'toptab1',
          icon: icon
        },
        {
          screenId: 'toptab2',
          icon: icon
        }]
    }
  });

我发现 react-native-navigation 的文档非常缺乏，这就是为什么我不确定为什么上面的代码不起作用。

我还启动了一个基于标签的应用程序，如下所示：

 Navigation.startTabBasedApp({
tabs: [
  {
    label: 'tab1',
    screen: 'tab1',
    icon: icon,  
    selectedIcon: icon,
    },
    title: 'tab1',
    navigatorStyle: {}, 
    navigatorButtons: {} 
  },
  {
    label: 'tab2',
    screen: 'tab2',
    icon: Icon,
    selectedIcon: Icon,
    title: 'tab2'
  },
  {
    label: 'tab3',
    screen: 'tab3',
    icon: Icon,
    selectedIcon: Icon,
    title: 'tab3'
  {
    label: 'tab4',
    screen: 'tab4',
    icon: Icon,
    selectedIcon: Icon,
    title: 'tab4',
    navigatorButtons: 
   }
 });

我觉得它可能在屏幕内是可行的

static navigatorStyle = {
};

但不知道那会是什么样子。任何有关如何做到这一点的帮助将不胜感激。

4

1 回答 1

1

示例应用中有一个示例 topTabs 屏幕

this.props.navigator.push({
  screen: 'example.Types.TopTabs',
  title: 'Top Tabs',
  topTabs: [{
    screenId: 'example.Types.TopTabs.TabOne',
    title: 'Tab One',
  }, {
    screenId: 'example.Types.TopTabs.TabTwo',
    title: 'Tab Two',
  }],
});
于 2017-07-23T05:43:46.217 回答