无法从 polymer 2.x 的下拉菜单中预先 select 第一项

Question

我在 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>

当我 select 上方下拉菜单中的某些项目时，下拉菜单会根据 selected 值填充，如下所示：

<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）会被预先 selected。因此，余额下拉菜单中的第一项（为零）也已预 selected。这可以。问题是，当我在 Person 下拉菜单中更改 selection 时，虽然 Balance 下拉菜单已正确填充，但第一个值未预先 selected。

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

Answer 1

看起来这是 polymer 2.0 元素预览版中的错误。我已经设法让它与以下代码一起工作：

if (this.selValue !== this.data[0]) {
  this.selValue = undefined;
  setTimeout(() => { this.selValue = this.data[0]; }, 0);
}

无法从 polymer 2.x 的下拉菜单中预先 select 第一项

Unable to pre select first item from drop down menu in polymer 2.x

polymer

polymer-2.x