Question

我有一个静态数据文件（json），用于存储诸如Facebook页面链接之类的信息。如果facebook页面链接为空，我不希望显示“关注我们”选项卡。 Facebook页面链接存储在 businessDataJSON.facebook 中。是否只有在 businessDataJSON.facebook 不为空（空字符串）时显示“关注我们”选项卡的方法？这是我的App.js：

const ListStack = createStackNavigator(
  {
    ListCategories: ListCategoriesScreen,
    ListCategoryItems: ListCategoryItemsScreen
  },
  {
    initialRouteName: "ListCategories",
    defaultNavigationOptions: {
      headerStyle: {
        backgroundColor: businessDataJSON.theme.navigationBarBackground
      },
      headerTintColor: businessDataJSON.theme.navigationBarTint,
      headerTitleStyle: {
        fontWeight: "bold"
      }
    }
  }
);

const FollowUsStack = createStackNavigator(
  {
    FollowUs: FollowUsScreen
  },
  {
    initialRouteName: "FollowUs",
    defaultNavigationOptions: {
      headerStyle: {
        backgroundColor: businessDataJSON.theme.navigationBarBackground
      },
      headerTintColor: businessDataJSON.theme.navigationBarTint,
      headerTitleStyle: {
        fontWeight: "bold"
      }
    }
  }
);

export default createAppContainer(
  createBottomTabNavigator(
    {
      ListTab: {
        screen: ListStack,
        navigationOptions: {
          title: businessDataJSON.theme.tabBarListTitle,
          tabBarIcon: ({ tintColor }) => (
            <Icon
              name={businessDataJSON.theme.tabBarListIcon}
              size={17}
              color={tintColor}
            />
          )
        }
      },
      FollowUsStack: {
        screen: FollowUsStack,
        navigationOptions: {
          title: "Follow Us",
          tabBarIcon: ({ tintColor }) => (
            <Icon name="users" size={17} color={tintColor} />
          )
        }
      }
    },
    {
      tabBarOptions: {
        activeTintColor: businessDataJSON.theme.tabBarIconActive,
        inactiveTintColor: businessDataJSON.theme.tabBarIconInactive,
        style: {
          elevation: 8,
          ...Platform.select({
            ios: { paddingTop: 4, paddingBottom: 4 },
            android: {
              borderTopWidth: 0,
              paddingTop: 6,
              paddingBottom: 6
            }
          })
        }
      }
    }
  )
);

Answer 1

是的，但是您将需要创建动感的选项卡，从而导致导航道具丢失，并且进行噩梦般的使用，而无需进行重新处理。我可以看到的简单方法是将root createSwitchNavigator与加载屏幕/开始屏幕以及选项卡作为第二屏幕一起使用。在加载屏幕中，检查是否有您的Facebook页面，并相应地导航至它们。该example用于身份验证，但适用于您的情况。相信我，导航道具是一场噩梦。

如何在createBottomTabNavigator中有条件地设置选项卡？

1 个答案: