【问题标题】:Extending class Polymer扩展类聚合物
【发布时间】:2018-02-15 14:16:26
【问题描述】:

我正在尝试将一个元素的类扩展到另一个自定义元素,以便我可以访问第一个自定义元素的属性。

<link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../src/data-model/data-model.html">

<dom-module id="pkg-view">
  <template>
    <style>

    </style>

    <data-model id="dm"></data-model>
    <vaadin-table-new></vaadin-table-new>
  </template>

  <script>
   class PkgView extends DataModel {
   static get is() { return 'pkg-view'; }
   static get properties() {
     return {
      conf_package: {
       type: Object
      }
     }
   }
 };

customElements.define(PkgView.is, PkgView);
  </script>
</dom-module>

正如您所看到的,我尝试扩展的自定义元素是 DataModel,但是,当我尝试运行它时,我收到以下错误,并引用了我的脚本标记中的第一行:

Uncaught ReferenceError: DataModel is not defined

我确定导入路径是正确的。我之前没有扩展元素,有什么明显的缺失吗? TIA

注意:我一直遵循以下指示:

https://www.polymer-project.org/2.0/docs/devguide/custom-elements#extending-other-elements

【问题讨论】:

  • data-model.html 中有什么内容?里面真的有一个类吗?也许它是混合或聚合物 1 元素,这意味着它不能扩展......

标签: javascript polymer-1.0 polymer-2.x html-components


【解决方案1】:

似乎data-model.html 没有公开DataModel 的类定义(例如,将其添加到window)。比直接引用类更灵活的方法是扩展从customElements.get() 返回的constructor。在你的情况下,你可以这样做:

class PkgView extends customElements.get('data-model') { ... }

demo

【讨论】:

  • 感谢您的帮助。我开始了解到,以这种方式扩展类只是扩大了数据模型 html 的范围,而不仅仅是公开它的属性。我真正想做的是在不触发全局事件的情况下在 2 个子 html 之间移动数据。关于这样做的最佳方式的任何想法? TIA
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2023-02-25
  • 2011-01-20
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多