时间戳

首页 > 解决方案 > 如何在 react-native 中为两个不同的组件提供两个不同的抽屉项目？

react-native - 如何在 react-native 中为两个不同的组件提供两个不同的抽屉项目？

问题描述

我有一个场景，其中有一个由所有书籍组成的匿名抽屉和一个由我的书籍和所有书籍组成的登录用户抽屉。我有一个抽屉路线导航文件，其中包含抽屉导航。如何在这两种情况下重复使用相同的导航？我还必须传递用户 ID。

标签： react-nativereact-navigationreact-navigation-drawer

解决方案

有一个通用函数，您将向该函数传递该抽屉项目的数据，如下所示：

drawerItem(drawerICon, drawerText, drawerItemNavigation){
     return (
            <View>Your drawer code here</View>
     )
}

使用主渲染函数的登录检查调用您的函数，如下所示：

render(){
     return(  
          <View>
            ......
            {
            this.props.user.logged_in
            &&
           this.drawerItem(iconsrc, "Home", "profile")
           }
           ....
      )

如果您想了解有关条件渲染的更多信息，请访问此资源

推荐阅读