Вложенный Drawer-StackNavigator, запуск DrawerOpen не работает на React-Native

Я делаю приложение с использованием React Native с реактивной навигацией.

[Иерархия моего приложения]

* Ящик (приложение)

ㄴ СтекНавигатор

ㄴ СтекНавигатор

Я хочу огня navigation.navigate('DrawerOpen');

Я могу показать свой ящик, перетащив его с левого края, но он не запускается нажатием «кнопки меню» слева от заголовка навигации. Я потратил так много времени, чтобы заархивировать это. Помогите мне, пожалуйста.

const Nav = StackNavigator({
    mainnav_list:{
        screen: (props) => <TodoList {...props} dbCollectionName={props.screenProps.dbCollectionName}/>,
        navigationOptions:({navigation}) => ({
            headerLeft:(
                <TouchableOpacity onPress={() => {console.log(navigation); navigation.navigate('DrawerOpen');}}>
                    <Text style={{color:'white', marginLeft:15}}>Menu</Text>
                </TouchableOpacity>
            )
        })
    },
    mainnav_detail:{screen: TodoDetail}
}
,
{
    navigationOptions:(props) => ({
        title:props.screenProps.dbCollectionName,
        headerBackTitle:null,
        headerStyle:{backgroundColor:'#000'},
        headerTitleStyle:{color:'#fff'},
        headerTintColor:'#fff',
    })
})

const AppDrawer = DrawerNavigator(
{
    drawer1:{screen:() => <Nav screenProps={{dbCollectionName:'todos'}}/> },
    drawer2:{screen:() => <Nav screenProps={{dbCollectionName:'todos2'}}/> }
})

AppRegistry.registerComponent('TodosFS', () => AppDrawer);

react-native react-navigation
person Bright Lee    schedule 13.12.2017    source источник

Ответы (2)


arrow_upward
7
arrow_downward

в новой версии reactnavigation для открытия, закрытия или переключения вашего DrawerNavigator Просто используйте следующее

this.props.navigation.openDrawer();
this.props.navigation.closeDrawer();
this.props.navigation.toggleDrawer();

https://reactnavigation.org/docs/en/drawer-based-navigation.html

person Mahdi Bashirpour    schedule 21.05.2018
comment
Тогда как мне передать параметр при использовании openDrawer? - person TomSawyer; 19.08.2018
comment
Это должно быть помечено как принятый ответ. Спасибо!! - person Roberto Rodriguez; 28.06.2019

arrow_upward
0
arrow_downward

Я решил это!!

const Nav = StackNavigator({
    mainnav_list:{
        screen: (props) => <TodoList {...props} dbCollectionName={props.screenProps.dbCollectionName}/>,
        navigationOptions:(props) => ({
            headerLeft:(
                <TouchableOpacity onPress={() => {props.screenProps.drawerNavigation.navigate('DrawerOpen');}}>
                    <Text style={{color:'white', marginLeft:15, fontWeight:'bold'}}>Menu</Text>
                </TouchableOpacity>
            )
        })
    },
    mainnav_detail:{screen: TodoDetail}
}
,
{
    navigationOptions:(props) => ({
        title:props.screenProps.dbCollectionName,
        headerBackTitle:null,
        headerStyle:{backgroundColor:'#000'},
        headerTitleStyle:{color:'#fff'},
        headerTintColor:'#fff',
    })
})

const AppDrawer = DrawerNavigator(
{
    drawer1:{screen:({navigation}) => <Nav screenProps={{dbCollectionName:'todos', drawerNavigation:navigation}}/> },
    drawer2:{screen:({navigation}) => <Nav screenProps={{dbCollectionName:'todos2', drawerNavigation:navigation}}/> }
})

AppRegistry.registerComponent('TodosFS', () => AppDrawer);
person Bright Lee    schedule 13.12.2017