按下Tab键时,React-Native Re-Render屏幕

时间:2019-06-28 14:03:09

标签: react-native react-navigation

我想添加两个标签栏。一个选项卡栏将一次显示,但另一个选项卡栏访问应该可见。 我想重新渲染主仪表板,以便选项卡栏将根据我从选项卡单击中更新的标志来显示。

如何从标签栏按下重新渲染组件。

type props = {};
let tabBarVisible = true;
export default class MainDashboard extends React.Component<props> {

  render() {
    return (
      <View style={styles.container}>
    =

        {tabBarVisible && <AppContainer screenProps={{ props: this.props }} />}
        {!tabBarVisible && <AppContainer2 screenProps={this.props} />}
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#000"
  },

});

const TabNavigator = createBottomTabNavigator(
  {
    Menu: {
      screen: CommunityListScreen,
      navigationOptions: {
        tabBarOnPress: ({ navigation, defaultHandler }) => {
          navigation.goBack();
          tabBarVisible = true;
        },
        tabBarIcon: ({ tintColor }) => (
          <View style={{ marginLeft: 35 }}>
            <Image
              source={require("../../assets/Dashboard/menu.png")}
            />
          </View>
        )
      }
    }
  },
  {
    activeColor: "#444cf8",
    animationEnabled: true,
    inactiveColor: "#919090",

  }
);

const TabNavigator2 = createBottomTabNavigator(
  {
   }
);

const AppContainer = createAppContainer(TabNavigator);
const AppContainer2 = createAppContainer(TabNavigator2);

0 个答案:

没有答案