美文网首页
RN navigation——drawerNavigator(五

RN navigation——drawerNavigator(五

作者: 木中木 | 来源:发表于2017-08-13 17:02 被阅读0次

    用法和其他两个差不多,英文文档:请看这里https://reactnavigation.org/docs/navigators/drawer
    这里提下方法:
    开启:this.props.navigation.navigate('DrawerOpen'); // open drawer
    关闭:this.props.navigation.navigate('DrawerClose'); // close drawer

    API Definition 
      const DrawerNav = DrawerNavigator({
            Home: { screen: MainScreen },
            Bill: { screen: MainScreen1 },
            Me: { screen: MainScreen1 },
            HomeTwo: { screen: MainScreen },
            HomeThree: { screen: MainScreen1 },
            HomeFour: { screen: MainScreen1 },
            BillTwo: { screen: MainScreen },
            BillThree: { screen: MainScreen1 }
        }, {
            drawerWidth: 200, // 抽屉宽
            drawerPosition: 'right', // 抽屉在左边还是右边
            // contentComponent: CustomDrawerContentComponent,  // 自定义抽屉组件
            contentOptions: {
              initialRouteName: 'Home', // 默认页面组件
              activeTintColor: 'white',  // 选中文字颜色
              activeBackgroundColor: '#ff8500', // 选中背景颜色
              inactiveTintColor: '#666',  // 未选中文字颜色
              inactiveBackgroundColor: '#fff', // 未选中背景颜色
              style: {  // 样式
    
              },
              onItemPress:(route)=>{//看了源码发现没有调用外部方法,没有调通
                debugger;
                console.log(route);
              }
            }
        });
        return (
            <DrawerNav />
        );
      }
    

    相关文章

      网友评论

          本文标题:RN navigation——drawerNavigator(五

          本文链接:https://www.haomeiwen.com/subject/vijerxtx.html