我目前正在使用OnsenUI开发一个phonegap应用,并且我想使用ons-splitter来创建一个没有角度的滑动菜单.但是,我在分离器方面遇到了一个问题,因为它似乎以一种始终在电话方向(横向或纵向)中打开的方式开发.根据文档,如果未定义“ collapse”参数,则默认情况下应始终将其折叠,但改为始终打开.我通过根据电话方向动态更改此参数来在javascript中部署了变通办法,但它滞后了一点,不能令人满意.

问题是这样的：是否可以迫使分流器侧仅在滑动时打开？还是有更好的解决方案使其正常工作？

HTML代码：

<ons-splitter var="splitter">
    <ons-splitter-side id="side_splitter" side="left" swipeable width="200px">
        <ons-page>
            <ons-toolbar>
                <div class="center">Menu</div>
            </ons-toolbar>
            <ons-list>
                <ons-list-item modifier="chevron">
                    Page 1
                </ons-list-item>
                <ons-list-item modifier="chevron">
                    Page 2
                </ons-list-item>
            </ons-list>
        </ons-page>
    </ons-splitter-side>
    <ons-splitter-content page="page1.html">
    </ons-splitter-content>
</ons-splitter>

JavaScript解决方法：

ons.orientation.on('change', function(e){
        if (e.isPortrait){
            console.log('portrait');
            $("#side_splitter").attr('collapse','portrait');
        } else {
            console.log('landscape');
            $("#side_splitter").attr('collapse','landscape');
        }
    })

解决方法:

温泉论坛上的一个好人回答了我的问题.文件令人误解.保留折叠参数未定义实际上是行不通的,您必须将其定义为空字符串：

<ons-splitter-side id="side_splitter" side="left" collapse="" swipeable width="200px">

希望这对某人有帮助.