美文网首页
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