SproutCore 以编程方式触发 MenuPane 中的项目选择

Posted 2023-02-26

【中文标题】SproutCore 以编程方式触发 MenuPane 中的项目选择

【英文标题】：SproutCore Programmatically fire item selection in MenuPane

【发布时间】：2011-11-30 16:20:49

【问题描述】：

我们正在使用 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】：

一些事情

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 上触发了他们的操作。

但是，如果您正在使用状态图（或者即使没有），您可以从项目中获取操作并调用它

App.statechart.sendEvent(toSelect.action);