反应原生侧菜单不工作

问题描述：

我正在尝试使用react-native-sidemenu https://github.com/react-native-community/react-native-side-menu 我的代码如下所示。没有错误，甚至输出相互重叠反应原生侧菜单不工作

var list = [{name: "komaldeep", subtitle: "dssdfds", avatar_url:"sadasdsa" }]; 

    export default class First extends Component { 

     constructor(props) { 
      super(props); 
     this.state = { 
      isOpen: false, 
     }; 
     this.toggleSideMenu = this.toggleSideMenu.bind(this); 
    } 



toggleSideMenu() { 
    this.setState({ 
     isOpen: !this.state.isOpen 
    }) 
} 

render() { 
    //menu list `enter code here` 
    const MenuComponent = (
     <View style={{flex: 1, backgroundColor: '#ededed', paddingTop: 200}}> 
      <List containerStyle={{marginBottom: 20}}> 

       { 
        list.map((l, i) => (

         <ListItem 
          roundAvatar 
          onPress={() => console.log('Pressed')} 
          avatar={l.avatar_url} 
          key={i} 
          title={l.name} 
          subtitle={l.subtitle} 
         /> 
        )) 
       } 

      </List> 
     </View> 
    ) 


    return (

     <SideMenu 
      isOpen={this.state.isOpen} 
      menu={MenuComponent} > 

      //Menu Component just contain some random text 
      <Menu toggleSideMenu={this.toggleSideMenu.bind(this)}/> 

     </SideMenu> 

    ); 
    } 
}

你能不能指导我..我在做什么错..

输出看起来像这样 enter image description here

答

原因菜单中的项目出现在屏幕右侧，看起来在菜单之外，就是您的MenuComponent占据了整个屏幕。将道具openMenuOffset={number}设置为SideMenu并使用相同的编号以您的MenuComponent的样式设置width: number。

反应原生侧菜单不工作

相关推荐