如何使用 Polymer 设置纸张下拉菜单的值答案

【问题标题】：How to set value of paper-dropdown-menu with Polymer如何使用 Polymer 设置纸张下拉菜单的值
【发布时间】：2019-08-15 21:00:54
【问题描述】：

我正在尝试在 Polymer 中设置 paper-dropdown-menu 的值，但遇到了问题。

paper-item 值与其innerHTML 不匹配，因此在尝试使用 Javascript 设置它时，它会显示一个数字而不是名称。

以下代码通过 id 正确设置项目，但我想改为按名称设置：

<paper-dropdown-menu id="contact">
  <paper-listbox id="contactList"
    attr-for-selected="value"
    slot="dropdown-content">
    <template is="dom-repeat" items="[[contacts]]">
      <paper-item value$="[[item.idContact]]">[[item.nameContact]]</paper-item>
    </template>
  </paper-listbox>
</paper-dropdown-menu>

...

_updateDom() {
  let cart = localStorage.getItem('idContact');
  this.$.contact.value = cart.idContact;
}

如何设置dropdown/listbox/item 使其显示显示名称？

【问题讨论】：

您过早地结束了您的问题。这是一个解决方案dbfiddle.uk/…
@JohnCappelletti 现在重新打开了...
stackoverflow.com/questions/57514852/… 正在尝试将逻辑放入用户定义的函数中...
你传递的是一行还是整个表？
添加了解决方案作为函数

标签： javascript polymer-2.x

【解决方案1】：

将id 赋予paper-item，而不是值

<paper-item id$="[[item.idContact]]">[[item.nameContact]]</paper-item>

并使用以下命令调用该项目：

_updateDom() {
  // If you have saved the object to localStorage, you may only save as String. 
  // So need to return to Object with `JSON.parse`. 
  // And you need to save object to localStorage with JSON.stringify(obj);
  let cart = JSON.parse(localStorage.getItem('idContact'));
  this.shadowRoot.querySelector('#'+ cart.idContact).innnerHTML = cart.nameContact;

}

【讨论】：