UI5中的事件注册——为一个事件附加多个监听器



如何在UI5中为一个事件添加多个事件侦听器?

我们有一个带有下拉列表的主列表,它在其控制器上正确地触发了一个select事件。为了重新加载模型数据,子控制器也需要被告知这个下拉菜单已经改变。

onAllRolesChange: function(oEvent) {
  var key = oEvent.getParameter("selectedItem").getProperty("text");
  if (this.ScreenId != null) {
    this.loadScreenByRole(key);
    // I could invoke the controllers directly, but that seems wrong
    // controller2.update();
    // controller3.update();
  }
},

我假设我应该瞄准的是在每个控制器中调用某种registerForEvent()方法,但我在SDK中没有看到这样的东西。fireEvent()attachEvent()存在,但我看到的例子似乎是创建自定义控件,或响应浏览器事件,SAP还没有实现。

从UI5 1.65开始,在创建ManagedObjects/Controls时可以分配多个事件处理程序:

(…)ManagedObjects现在接受一个事件的多个事件侦听器数组。来将此用例与[data, listener, this]已经支持的数组区分开来,具有多个侦听器的数组也必须为每个侦听器使用嵌套数组表示法[在JS中]。在XMLViews中,必须用分号分隔多个侦听器。(源)

<标题> 语法在XMLView

<Button press=".myControllerMethod; .mySubController.thatMethod" />
在JS

new Button({
  press: [
    [ listener1 ], // 1st listener
    [ data, listener2, thisArg2 ] // 2nd listener
  ]
});

<标题> 演示

sap.ui.getCore().attachInit(() => sap.ui.require([
  "sap/ui/core/mvc/XMLView"
], XMLView => XMLView.create({
  definition: `<mvc:View xmlns:mvc="sap.ui.core.mvc"
    xmlns="sap.m"
    height="100%"
    displayBlock="true"
  >
    <Button text="Press" class="sapUiTinyMargin"
      press="alert('1st event handler'); alert('2nd event handler')"
    />
  </mvc:View>`,
}).then(view => view.placeAt("content"))));
<script id="sap-ui-bootstrap"
  src="https://openui5nightly.hana.ondemand.com/resources/sap-ui-core.js"
  data-sap-ui-libs="sap.ui.core, sap.m"
  data-sap-ui-async="true"
  data-sap-ui-compatVersion="edge"
  data-sap-ui-theme="sap_fiori_3"
></script>
<body id="content" class="sapUiBody"></body>

您可以使用EventBus来通知更改,并且任何人都可以侦听更改。然而,如果其他控制器还没有加载,它们当然不会得到事件……也许你可以把这个和承诺结合起来……

你也可以使用带有双向绑定的全局模型,并将其用于下拉菜单。当下拉菜单发生变化时,变化会反映在相应的模型中。同时,在你的子控制器中,你可以创建一个sap.ui.model.Binding(…),用于相同的全局模型+路径等,用于你的下拉菜单。此外,您还需要为Binding的更改事件附加一个处理程序…这应该也可以。然而,这与使用EventBus有相同的缺点,但也许thatÄs对你来说不是问题…

相关内容

  • 没有找到相关文章

最新更新