如何隐藏特定屏幕上的底部标签栏(react-navigation 3.x) [英] How can I hide the bottom tab bar on a specific screen (react-navigation 3.x)

查看:35
本文介绍了如何隐藏特定屏幕上的底部标签栏(react-navigation 3.x)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用了 createBottomTabNavigator,但无法隐藏特定屏幕上的底部应用栏

I used the createBottomTabNavigator, but I can't hide the bottom app bar on a specific screen

const StackHome = createStackNavigator(
  {
    Home: Home,
    Autor: Autor,
    Publicacion: Publicacion,
    Comentarios: {
      screen: Comentarios,
      navigationOptions:{
        // this should do the work, but it doesn't
        tabBarVisible: false
      }
    }
  }
);

推荐答案

最后我得到了一个有效的解决方案,组件应该是这样的

Finally I got a solution that works, the component would be like this

import { createStackNavigator } from "react-navigation";
import Home from "./Home";
import Autor from "./Profile";
import Publicacion from "./Publicacion";
import Comentarios from "./Comentarios";

const StackHome = createStackNavigator({
  Home: Home,
  Autor: Autor,
  Publicacion: Publicacion,
  Comentarios: Comentarios
});

// This does the trick
StackHome.navigationOptions = ({ navigation }) => {
  let tabBarVisible;
  if (navigation.state.routes.length > 1) {
    navigation.state.routes.map(route => {
      if (route.routeName === "Comentarios") {
        tabBarVisible = false;
      } else {
        tabBarVisible = true;
      }
    });
  }

  return {
    tabBarVisible
  };
};

export default StackHome;

这篇关于如何隐藏特定屏幕上的底部标签栏(react-navigation 3.x)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆