Question

示例代码：

<iron-form id="form1">
    <form method="get" action="/form/handler">
        <paper-input name="name" label="Name" required></paper-input>
        <paper-dropdown-menu label="Dinosaurs">
            <paper-listbox slot="dropdown-content" selected="1">
                <paper-item>allosaurus</paper-item>
                <paper-item>brontosaurus</paper-item>
                <paper-item>carcharodontosaurus</paper-item>
                <paper-item>diplodocus</paper-item>
            </paper-listbox>
        </paper-dropdown-menu>
        <paper-button raised on-click="_save">Save</paper-button>
        <paper-button raised on-click="_reset">Reset</paper-button>
      </form>
</iron-form>

...


_reset() {
    this.$.form1.reset();
}

重置＆＃39;单击按钮，下拉列表未设置为其默认值。

Answer 1

paper-dropdown-menu的问题在于它没有自己设置值的机制。

而不是它允许您通过paper-listbox属性获取其包含的contentElement并调用set方法。

iron-form无法在此处执行任何魔法我很害怕，所以我扩展了_reset方法：

_reset() {
    this.$.myDropdown.contentElement.set('selected', null); // or whatever fallback
    this.$.form1.reset();
}

当然你也可以直接参考列表框。

Answer 2

您可以为所选属性使用变量：

 <paper-listbox slot="dropdown-content" selected="{{selected}}">

并在以下位置定义所选属性：

 static get properties() { return {
     selected: {type:Number, value:1},...

并在重置功能上设置为1：

_reset() {
    this.set('selected', 1);  // 
    this.$.form1.reset();
}

提交表单数据时可以使用所选属性的聚合方式。

如何重置铁形式中的纸张下拉菜单？

2 个答案: