Question

我正在创建一个元素，导入它并使用数据设置属性。我希望代码只有在以前没有导入和创建元素时才能执行。调用该函数时，我收到以下错误：

this._dialogPopUp.open is not a function

正在发生的事情是this._dialogPopUp.open();在创建和导入元素之前正在执行。如果我第二次点击按钮弹出窗口，因为它之前已经创建并导入了。如何让它等待创建和导入元素，然后继续执行？

目前我有这个实现：

_loadDialogPopUp(e) {
  let me = this;
  if(!me._dialogPopUp){
    me._dialogPopUp = document.createElement('su-dialog');
    Polymer.importHref(this.resolveUrl('su-dialog.html'), (e) => {
      this.root.appendChild(this._dialogPopUp);
    });
  }
  customElements.whenDefined('su-dialog').then(() => {
    me._dialogPopUp.open();
    me._dialogPopUp.setAttribute('uid', this.user.uid);
  })
}

Answer 1

在使用它的功能之前，您必须检查元素是否实际上已“升级”。幸运的是标准思想。

customElements.whenDefined('su-dialog').then(() => {
  this._dialogPopUp.open();
  this._dialogPopUp.setAttribute('uid', this.user.uid);
});

了解更多细节请参阅 https://developers.google.com/web/fundamentals/architecture/building-components/customelements

Polymer 2.0如何createElement然后使用Polymer.importHref导入并使用setAttribute

1 个答案: