tabnavigator 和 stacknavigator 问题——你应该只渲染一个导航器答案

【问题标题】：tabnavigator and stacknavigator problem-you should only render one navigatortabnavigator 和 stacknavigator 问题——你应该只渲染一个导航器
【发布时间】：2018-09-03 16:56:50
【问题描述】：

它是我的 App.js

我想在未登录时使用堆栈导航器，然后在 sıgnIn 页面中使用 tabnavigator

const AppNavigator=createStackNavigator({

    SıgnIn:{screen:SıgnIn},
    Welcome:{screen:Welcome},
    SıgnUp:{screen:SıgnUp},
    ForgetPassword:{screen:ForgetPassword},


});

它是我的 App.js

export default class App extends Component {


    render() {

        return (
         <AppNavigator></AppNavigator>
        );
    }
}

这是我的登录页面

const  AppTabNavigator = TabNavigator({
    HomeTab:{screen:HomeTab},
    Search:{screen:Search},
    AddMedia:{screen:AddMedia},
    Followers:{screen:Followers},
    Profile:{screen:Profile},
},

它说你应该只渲染一个导航器

【问题讨论】：

标签： reactjs native tabnavigator stack-navigator

【解决方案1】：

我建议使用诸如isAuthenticated 之类的布尔值来有条件地渲染您的导航器。你可以在App.js中使用三元运算符来做这样的事情：

export default class App extends Component {
    render() {
        return (
            <div className='App'>
                { isAuthenticated ? <AppNavigator/> : <AppTabNavigator/> }
            </div>
        )
    }
}

【讨论】：