单击导航栏按钮,抽屉未打开. 这是我用于按下按钮的代码 if (event.type === 'NavBarButtonPress') { if (event.id === 'sideDrawerToggle') { this.props.navigator.toggleDrawer({ side: 'left', animated: true, }); } } 这是抽屉
这是我用于按下按钮的代码
if (event.type === 'NavBarButtonPress') {
if (event.id === 'sideDrawerToggle') {
this.props.navigator.toggleDrawer({
side: 'left',
animated: true,
});
}
}
这是抽屉设置
Navigation.startTabBasedApp({
tabs: [
{
label: 'Find Place',
screen: 'places.FindPlace',
title: 'Find Place',
icon: source[0],
navigatorButtons: {
leftButtons: [
{
icon : source[2],
title : 'Menu',
id: 'sideDrawerToggle'
}
]
}
},
{
label: 'Share Place',
screen: 'places.SharePlace',
title: 'Share Place',
icon: source[1],
navigatorButtons: {
leftButtons: [
{
icon: source[2],
title: 'Menu',
id: 'sideDrawerToggle'
}
]
}
}
],
drawer: {
left: {
screen: 'places.SideDrawer'
}
}
});
这就是我抽屉的样子
import React, {Component} from 'react';
import {View, Text, Dimensions} from 'react-native';
class SideDrawer extends Component {
render() {
return(
<View style={[
styles.container,
{width: Dimensions.get('window').width * 0.8}
]}>
<Text>Drawer</Text>
</View>
);
}
}
const styles = {
container: {
backgroundColor : 'white',
paddingTop: 22,
flex: 1
}
};
export default SideDrawer;
通过搜索很多我发现给抽屉一个固定的宽度解决了问题.但它在我的情况下没有解决.我不知道代码有什么问题,它运行正常.
你可以简单地使用this.props.navigation.openDrawer();
在你的屏幕上.
请从以下链接查看官方文档和示例
https://reactnavigation.org/docs/en/drawer-based-navigation.html
https://reactnavigation.org/blog/#drawer-routes-have-been-replaced-with-actions
