Question

我正在运行聚合物1.0.9 paper-menu元素，但默认行为并不像我想的那样。

当您在paper-menu中选择项目时，项目会被切换。要再次选择相同的项目，您必须在菜单中选择另一个项目，然后重新选择第一个项目。

目前它的工作原理如下： https://elements.polymer-project.org/elements/paper-menu?view=demo:demo/index.html

但我想要一个常规按钮的行为，但我仍然想要paper-menu附带的“免费”行为。

按下按钮后是否有一种直接取消选择按钮的智能方法？这是我的菜单：

<paper-menu id= "action-menu">
  <template is="dom-repeat" items="{{actions}}" as="action">
    <paper-icon-item id={{action.attributes.id}}>
      <iron-icon icon="{{action.attributes.icon}}" item-icon>
      </iron-icon>
        <p>{{action.attributes.title}}</p>
    </paper-icon-item>
  </template>
</paper-menu>

Answer 1

我已通过在菜单的事件处理程序中将var %variable-name = value属性设置为selected来解决此问题。效果很好。

或者（如果像我一样使用null元素，您也可以使用<paper-menu-button>或paper-dropdown-close上的<paper-menu-button>。

PS：我知道这是一个老问题，但是https://github.com/Polymer/paper-menu-button/issues/56上有一个开放的错误报告，我今天确实遇到了这个问题 - 所以这对某些人来说也许是有用的。

Answer 2

您可以尝试收听铁激活事件，当选择所述项目时，您可以调用menu.select（index）取消选择它。

类似[伪代码]：

<paper-menu id="action-menu" on-iron-activate="onMenuActivate">

...

onMenuActivate: function(event, detail) {
    var menu = Polymer.dom(event).localTarget,
        name = event.detail.selected,
        selected = (menu.selectedValues || []).indexOf(name) == -1;

    if (name == MY_SPECIAL_INDEX && selected) {
          menu.select(name);
    }
}

激活事件在选择项之前触发，这就是为什么必须检查当前所选项目列表中所选项目不是的原因。

单击后取消选择纸张菜单中的项目

2 个答案: