0

我在 Polymer 2.x 中使用 paper-dropdown-menu，如下所示：

<paper-dropdown-menu label="Person" class="item">
  <paper-listbox id="name" slot="dropdown-content" attr-for-selected="value" selected="{{selName}}" on-iron-select="nameSelected">
    <paper-item value="John">John</paper-item>
    <paper-item value="Bush">Bush</paper-item>
    <paper-item value="Afridi">Afridi</paper-item>
  </paper-listbox>
</paper-dropdown-menu>

当我从上面的下拉菜单中选择某个项目时，下拉菜单会根据所选值填充，如下所示：

<paper-dropdown-menu label="Balance" class="item">
  <paper-listbox id="Balance" slot="dropdown-content" attr-for-selected="value" selected="{{selValue}}">
    <template is="dom-repeat" items="[[data]]">
      <paper-item value="{{item}}">{{item}}</paper-item>
    </template>
  </paper-listbox>
</paper-dropdown-menu>

事件处理程序

nameSelected(event) {
  var selectedItem = event.target.selectedItem.textContent;
  this.data = [];
  if (selectedItem === 'John') {
    for (var i = 0; i < 20; i++) {
      this.data.push(i);
    }
  } else {
    for (var i = 20; i < 40; i++) {
      this.data.push(i);
    }
  }

  this.selValue = this.data[0];
}

首次加载页面时，会预先选择 Person 下拉菜单中的第一个值（即 John）。因此，余额下拉菜单中的第一项（为零）也被预先选择。这可以。问题是，当我在“人员”下拉菜单中更改选择时，虽然“余额”下拉菜单已正确填充，但第一个值未预选。

你能指导我解决这个问题吗？

4

1 回答 1

1

看起来这是聚合物 2.0 元素预览版中的错误。我设法使它与以下代码一起工作：

if (this.selValue !== this.data[0]) {
  this.selValue = undefined;
  setTimeout(() => { this.selValue = this.data[0]; }, 0);
}
于 2017-05-02T09:20:37.867 回答