Monaca应用程序可在仪表板预览中运行，但不能在Android 6手机上运行

Question

我正在尝试修改Onsen-UI的基本待办事项列表示例。

我在菜单中添加了一个新按钮。

<ons-toolbar-button id="resptab" >
    <ons-icon icon="ion-pie-graph" size="28px"></ons-icon>
    Table
</ons-toolbar-button>

和导航器包装列表

<ons-splitter id="splitter">
    <ons-splitter-side id="splitter-menu" page="menu.html" 
        side="left" width="220px" collapse swipeable>
    </ons-splitter-side>
    <ons-splitter-content>
        <ons-navigator id="myNavigator" animation="slide" page="list.html"/>
    </ons-splitter-content>
</ons-splitter>

我正在通过事件监听器从脚本推送新页面

document.querySelector('#resptab').addEventListener('click', this.setRespTable.bind(this));

和一个功能

todo.setRespTable = function() {
    ons.notification.prompt('Switch to responsive table view',{
        title: 'Responsive Table',
        cancelable: true,

        callback: function(label) {
            document.querySelector('#myNavigator').pushPage('table.html')
        }.bind(this)
    });    
}

一切正常，并在预览版桌面仪表板中正常运行，但是当我在Galaxy Android 6手机上使用Monaca Debugger尝试运行时，它失败并显示日志错误，表明querySelector为null

我还注意到，当我在Android手机上运行该应用程序时，菜单中未显示上述按钮，而-再次-我可以从仪表板“预览”中看到它。

Answer 1

通过将按钮替换为菜单项解决了这两个问题

<ons-list>
    <ons-list-item data-filter="all" tappable>All</ons-list-item>
    <ons-list-header>Status</ons-list-header>
    <ons-list-item data-filer="uncompleted">Pending</ons-list-item>
    <ons-list-item data-filter="completed">Completed</ons-list-item>
    <ons-list-header>Responsive</ons-list-header>
    <ons-list-item id="resptab" ><ons-icon icon="ion-pie-graph" size="28px"></ons-icon>RxTable</ons-list-item>        
</ons-list>

并通过在菜单init中设置事件处理程序

document.addEventListener('init', function(event) {
    var view = event.target.id;
    if (view === 'menu' || view === 'list') {
        todo[view + 'Init'](event.target);
    };
}, false);

哪个电话

todo.menuInit = function(target) {
    document.querySelector('#resptab').addEventListener('click', this.setRespTable.bind(this));     
}

在本文的最后，有一个带有React的OnsenUI中的相应版本，摘自下面的render函数：

<Page>
    <List dataSource={['Searching', 'Lists', 'Twitting', 'Google Drive','Settings']}
    renderRow={(title) => (
        <ListItem key={title} 
        onClick={() => this.hide2title(title)} tappable>{title}
        </ListItem>
    )}/>
</Page>

在后一种情况下，请注意数组函数将值传递给方法。