纸张下拉菜单选择的财产问题

Question

您好：

我有一个paper-dropdown-menu从一个可观察变量中填充，每当变量发生变化时我想重新选择第一个项目。然而，第一次它正常工作，下次它会继续选择第一个被选中的第一个元素。这是组件的html和dart代码;

paper_dropdown_menu_bug_test.dart

import 'package:polymer/polymer.dart';

@CustomTag('paper-dropdown-menu-bug-test')
class PaperDropdownMenuBugTest extends PolymerElement {
  @observable List list;

  PaperDropdownMenuBugTest.created() : super.created(){
    this.list = [0, 1, 2];    
  }

  listChanged(){
    this.$["paper-dropdown-menu"].selected = 0;
  }

  changeList(){
    this.list = [3, 4, 5]; 
  }
}

paper_dropdown_menu_bug_test.html

<link rel="import" href="packages/polymer/polymer.html">
<link rel="import" href="packages/paper_elements/paper_dropdown_menu.html">
<link rel="import" href="packages/paper_elements/paper_item.html">

<polymer-element name="paper-dropdown-menu-bug-test">
  <template>
    <paper-dropdown-menu id="paper-dropdown-menu">
      <template repeat="{{item in list}}">
        <paper-item label="{{item}}"></paper-item>
      </template>
    </paper-dropdown-menu>
    <button on-click="{{changeList}}">Change List</button>
  </template>
  <script type="application/dart" src="paper_dropdown_menu_bug_test.dart"></script>
</polymer-element>

我做错了，是否有解决方法或者我应该填写错误报告？ （我已经尝试过选择另一个索引，然后选择0，但不起作用）

提前致谢

Answer 1

您需要添加valueattr="label"以配置<paper-dropdown-menu>以使用标签值来选择项目。

<paper-dropdown-menu id="paper-dropdown-menu" valueattr="label">

---

一些其他建议：

而不是

listChanged(){
  this.$["paper-dropdown-menu"].selected = 0;
}

使用

<paper-dropdown-menu id="paper-dropdown-menu" selected="{{selected}}" valueattr="label">

@observable var selected;

listChanged() => selected = list.first;

---

如果你写

，效果会相同

@observable List list = [0, 1, 2];

PaperDropdownMenuBugTest.created() : super.created()

或

@observable List list;

PaperDropdownMenuBugTest.created() : super.created(){
  this.list = [0, 1, 2];    
}