How can i access to redux store with react navigation?

前端 未结 2 1953
小鲜肉
小鲜肉 2021-01-29 11:00

I have App \"Music App\" for tow users type \"Guest, a user registered\"

I have a bottom navigator for those, When Guest opens my app I want to render just 4 bottom tabs

2条回答
  •  星月不相逢
    2021-01-29 11:36

    I think you meant to make App a component. In this case it'd be a functional component, so no this, and you also need to return valid JSX.

    const App = props => props.isLogin ? (
        
      ) : (
        
      );
    

    Notice I've PascalCased the notLoginTabs component to be react compliant, and returning them as JSX with props spread in.

    If the child components don't care about isLogin then destructure it out before passing props. This cleans up the code and doesn't pass unnecessary props on to children.

    const App = ({ isLogin, ...props }) => isLogin ? (
        
      ) : (
        
      );
    

    EDIT

    Create a tabs component which houses your authenticated and unauthenticated tabs.

    const LoginTabs = createBottomTabNavigator( ... );
    const NotLoginTabs = createBottomTabNavigator( ... );
    
    const Tabs = ({ isLogin, ...props }) => isLogin ? (
        
      ) : (
        
      );
    
    const mapStateToProps = state => ({
      isLogin: state.user.isLogin,
    });
    
    export default AuthTabs = connect(mapStateToProps)(Tabs)
    

    In AppTest

    ...
    const AppNavigator = createStackNavigator(
      {
        TabHome: {
          screen: AuthTabs,
    ...
    

提交回复
热议问题