SproutCore以编程方式在菜单栏中启动项目选择

SproutCore Programmatically fire item selection in MenuPane

本文关键字：启动 项目 选择 菜单栏 编程 方式 SproutCore      更新时间：2023-09-26

我们正在使用SproutCore v1.6，并试图以编程方式设置所选菜单项。MenuPane如下图所示。

OurPage = SC.Page.design({
    myAccountMenu: SC.MenuPane.create({
        layout: { width: 200 },
    
        items: [
          { title: 'Sign Out', action: 'signOut' }
        ],
    
        itemActionKey: 'action',
        itemTitleKey: 'title'
    })
});

然后我们尝试按如下方式设置'selectedItem'。

OurPage.getPath('myAccountMenu').set('selectedItem', OurPage.getPath('myAccountMenu').items[0])

这将正确设置所选项目，我们可以通过以下查询来获取项目:

OurPage.getPath('myAccountMenu').get('selectedItem')

然而，它从来没有真正触发菜单上的操作。它实际上并没有让用户退出。但是，当您手动单击菜单项时，它可以正常工作。

一些事情

1)在页面上使用outlet来获取accountMenu

OurPage = SC.Page.design({
    menu: SC.outlet('myAccountMenu'),
    myAccountMenu: SC.MenuPane.create({...})
});

这样，如果myAccountMenu的路径改变了，你只需要改变你的出口。

2)要设置项目，只需执行

var toSelect = OurPage.getPath('menu').items[0];
OurPage.setPath('menu.selectedItem', toSelect);

3)查看代码，当以编程方式设置选择时，没有简单的方法来调用操作。这是因为你传入的物品会变成MenuItemView实例，而这些实例会在mouseUp上启动它们的行动。

然而，如果您正在使用statecharts(或者即使没有)，您可以直接从项目中抓取操作并调用它

App.statechart.sendEvent(toSelect.action);

相关文章：