Search code examples
onsen-ui

two side slide menu in onsen-ui skips main page, while swiping from right menu

Im implementing facebook like two side swipe menus for phone app, Im using the following code in

code herehttp://codepen.io/anon/pen/xGWPVj

slide right and left work fine when i use top extreme buttons, but when try swiping on phone (click drag pages on PC) there are anomalies. when i swipe this way

1) main page to left menu - works fine
2) left menu to main page - works fine
3) main page to right menu - works fine
4) right menu to main page - fails, instead of main page it goes to left menu
after 4. main page never accessible

i tried to nest the sliding menu in other way around then right menu gives same symptoms and left works fine.

should i stop propagating touchmove/drag event in any pages?

Solution

  • I am not sure about where is the problem yet, it looks like something is buggy. I made a provisional workaround that may help you. Simply use postopen and postclose events to lock the menu you don't need:

    <ons-sliding-menu var="rightMenu" ...
                  ons-postopen="leftMenu.setSwipeable(false);"
                  ons-postclose="leftMenu.setSwipeable(true);">
</ons-sliding-menu>

    Example here: http://codepen.io/frankdiox/pen/XbEzqq

    Hope it helps!