聚合物1.0找不到纸张菜单或纸张项目的事件

问题描述

升级到Polymer 1.0，我如何收听/捕捉铁菜单行为的"focusedItem"变化?我看不到任何项目更改的事件或属性更改侦听器，即纸张菜单中纸张项目选择的更改.我在这里看不到任何此类事件: https://elements .polymer-project.org/elements/iron-menu-behavior?active = Polymer.IronMenuBehavior

Upgrading to Polymer 1.0, How do I listen/capture to change in "focusedItem" of iron-menu-behaviour? I cannot see any event or property change listener for an item change i.e. change in paper-item selection within a paper-menu. I cannot see any such events here: https://elements.polymer-project.org/elements/iron-menu-behavior?active=Polymer.IronMenuBehavior

推荐答案

我目前尚未找到任何有关此问题的文档(也许其他人可能会比较幸运)，但是您要查找的事件是 iron-select 和 iron-deselect .这两个事件都使用处理程序格式:eventHandler(e, details)，其中:

I have not been able to find any documentation on this just yet (perhaps someone else may have better luck), but the events you are looking for are iron-select and iron-deselect. Both of these events use the handler format: eventHandler(e, details), in which:

• e是CustomEvent.
• details是具有item属性的对象，该属性指向已选择或取消选择的元素.

• e is the CustomEvent.
• details is an object with an item property pointing to the element that was selected or deselected.

我已经在Plunker上设置了 demo .它具有一个示例菜单，并将e和details都从iron-select和iron-deselect事件记录到控制台.

I've set up a demo on Plunker that you can play around with. It has a sample menu and will log both e and details from both iron-select and iron-deselect events to the console.

话虽这么说，但如果您能够避免使用该事件而改为使用绑定，那么我建议您先使用该路由.如果这是在自定义元素中，则可以执行以下操作:

That being said, however, if you are able to avoid using the event and instead use bindings, I would recommend that route first. If this is within a custom element, you could, for example, do:

<dom-module id="my-custom-element">
  <template>
    <div>
      <span>[[selectedMessage]]</span>
      <span>[[oldSelectedMessage]]</span>
    </div>
    <paper-menu selected="{{selectedIndex}}">
      <paper-item>This is item #0</paper-item>
      <paper-item>This is item #1</paper-item>
      <paper-item>This is item #3</paper-item>
    </paper-menu>
  </template>
</dom-module>

<script>
  Polymer({
    is: 'my-custom-element',
    properties: {
      selectedIndex: {
        type: Number,
        value: 0,
        observer: '_selectedIndexChanged'
      }
    },
    _selectedIndexChanged: function(newIndex, oldIndex) {
      if (typeof newIndex === 'number') {
        this.selectedMessage = 'You selected item #' + newIndex + '.';
      }
      if (typeof oldIndex === 'number') {
        this.oldSelectedMessage = 'Before, you had item #' + oldIndex + ' selected.';
      }
    }
  });
</script>

这篇关于聚合物1.0找不到纸张菜单或纸张项目的事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！