Imagine having react-native-side-menu component with 2 side menus.

Usage no npm install needed!

<script type="module">
  import reactNative2SideMenus from '';



Imagine having react-native-side-menu component with 2 side menus.



npm install react-native-2-side-menus

Usage Example

create a main component and pass your left and right components

class Example1 extends Component {
  constructor(props) {

  componentDidMount() {, this.refs.rightMenu);

    setTimeout(() => {'left');

      setTimeout(() => {;
      }, 2000);

    }, 2000);

  render() {
    return (
        leftMenu={<Menu ref="leftMenu" color="yellow"/>}
        rightMenu={<Menu ref="rightMenu" color="red"/>}>
        <ScrollView style={{ flex: 1, backgroundColor: 'blue' }}><View style={{ height: 2000 }}></View></ScrollView>

Ref Methods

  • openMenu(side) side can be either left or right
  • closeMenu() closes either left or right menu if they are open. There will be no operation if none of them are opened.
  • moreLifeCycles(leftMenuRef, rightMenuRef) if you need this components calls menuMightOpen, menuDidOpen and menuDidClose in menu component, call this method in both componentDidMount and componentWillReceiveProps component.
  • enableMenu(side, enable) enables or disables the menu that you selected. enable value indicates the action.


  • toleranceX: (number) X axis tolerance
  • toleranceY: (number) Y axis tolerance
  • animationStyle: (func)
  • animationFunction: (func)
  • gestures: (bool or func)
  • leftMenu: (element) left menu component
  • rightMenu: (element) right menu component
  • openLeftMenuOffset: (number)
  • openRightMenuOffset: (number)
  • leftMenuToggleOffset: (number)
  • rightMenuToggleOffset: (number)
  • touchToClose: (bool) Allows for touching the partially hidden view to close the menu

Braking changes

  • v0.2.x
    • there will be no more toggleMenu. i found no use for that.


Thanks for amazing code and contributors for react-native-side-menu and special thanks to @Kureev for his work on react-native-side-menu