React native '；抽屉套'；本机中工作但不可见的内容

使用react native

“反应”：“16.0.0”

“反应本机”：“0.50.4”

并使用“react navigation 1.0”

一切都很好，但当我按抽屉菜单打开它的工作打开，但它的不可见只显示底图颜色（黑色）

我试图删除另一个堆栈导航器上的标题组件..或查找DrawerComponent内部的问题。但还是不明白

当我没有更改为选项卡导航时，它工作得很好，但我需要添加选项卡导航器，所以更改了它

请帮帮我

const RootNavigator=StackNavigator({
初始化：{screen:InitComponent}，
根：{screen:TabStack}，
})
const TabStack=TabNavigator({
抽屉钉：{屏幕：抽屉钉，}，
AddrDrawerStack:{屏幕：AddrDrawerStack}，
StorageDropersTack:{屏幕：StorageDropersTack}，
},
{
导航选项：（{navigation}）=>({
标题：，
tabBarIcon:（{focused，tintColor}）=>{
const{routeName}=navigation.state；
返回{icon}；
},
}),
tabBarComponent:TabBarBottom，
tabBarPosition:'底部'，
选项卡选项：{
activeTintColor:‘番茄’，
颜色：“灰色”，
},
//animationEnabled:错误，
是的，
})
const DrawerStack=DrawerNavigator（{
MailStack:{screen:MailStack}，
}, {
手势已启用：错误，
contentComponent:DrawerContainer，
})

**DrawerContainer.js**

class DrawerContainer extends React.Component {


  constructor(props, context){
    super(props,context);

    this.state = {
      selectMenu: false,
    }
    this.props.getMailboxMenuList();
    this.menuClick = this.menuClick.bind(this);

  }


  menuClick(menuName){  

    this.setState({
        selectMenu: true,
    });
    this.props.mailBoxChange(menuName)
    this.props.navigation.navigate("DrawerStack", {menu:menuName});
  }



  render() {


    const { navigation, mailboxMenuList } = this.props;


   if(!mailboxMenuList){

    return (

      <View style={styles.container}>
          <Text>try again</Text>    
     </View>

     )
   }    

    return (

      <View style={styles.container}>
         <View style={styles.menuMailTop}> 

             <TouchableHighlight 
               onPress={()=>{this.props.navigation.navigate("PostScreen",{type:'write'})}}
               style={styles.menuMailBoxBtn} >
                <Text> write </Text>
           </TouchableHighlight> 

        </View>

        <View>
          {
            mailboxMenuList.items? <BasicMailBox 
                                        mailList={mailboxMenuList.items}
                                        onReloadClick={this.props.reloadExternalMailbox.bind(this)}
                                        externalLoading={this.props.externalLoading}
                                        selectMenu ={this.state.selectMenu}
                                        menuClick={this.menuClick.bind(this)} />
            :<View></View>
          }
      </View>         
  </View>

  ) }
  }

类抽屉容器扩展React.Component{
构造函数（道具、上下文）{
超级（道具、背景）；
此.state={
选择菜单：false，
}
this.props.getMailboxMenuList（）；
this.menuClick=this.menuClick.bind（this）；
}
menuClick（menuName）{
这是我的国家({
选择菜单：true，
});
this.props.mailBoxChange（menuName）
this.props.navigation.navigate（“DrawerStack”，{menu:menuName}）；
}
render（）{
const{navigation，mailboxMenuList}=this.props；
如果（！mailboxMenuList）{
返回(
再试一次
)
}    
返回(
{this.props.navigation.navigate（“PostScreen”，{type:'write'}}}
style={styles.menuMailBoxBtn}>
写
{
mailboxMenuList.items？
:
}
) }
}

**抽屉开启法**

  <TouchableHighlight
       onPress= {() => {  
              //when i press this, index indicates 0  
            if (navigation.state.index === 0) {
                                         navigation.navigate('DrawerOpen')
                                      //  navigation.openDrawer()
                                  } else {
                                        navigation.navigate('DrawerClose')
                                  }
                                }
                          } >
                    </TouchableHighlight>

{
//当我按下此键时，索引指示0
if（navigation.state.index==0）{
navigation.navigate（'drawerropen'）
//navigation.openDrawer（）
}否则{
导航。导航（'DrawerClose'）
}
}
} >

hi，实际上抽屉打开了，但抽屉的样式似乎不正确，您能提供您在抽屉容器类上使用的样式吗。@Prince hi我刚刚发现样式（高度）测量错误，现在可以正常工作了。。谢谢你考虑。。。！！不客气，我还发布了一个npm，它可以帮助您使用RN构建基本应用程序@王子哇太棒了我早该知道的。。！谢谢没有问题的兄弟，你可以告诉其他新来的人。

  <TouchableHighlight
       onPress= {() => {  
              //when i press this, index indicates 0  
            if (navigation.state.index === 0) {
                                         navigation.navigate('DrawerOpen')
                                      //  navigation.openDrawer()
                                  } else {
                                        navigation.navigate('DrawerClose')
                                  }
                                }
                          } >
                    </TouchableHighlight>