Polymer服务于扩展的自定义元素?

时间:2018-06-11 22:30:55

标签: javascript polymer

这可能吗?文档很模糊,我正在使用所有三个版本的Polymer进行测试。 v2使用polymer cli创建一个基本组件,并在兄弟目录中创建另一个基本组件的示例:

element-one
├── element-one.html
element-two
├── element-two.html

更新为第一个扩展元素:

<link rel="import" href="../polymer/polymer-element.html">
<link rel="import" href="../element-one/element-one.html">

<dom-module id="element-two">
  <template>
    <style>
      :host {
        display: block;
      }
    </style>
    <h2>Hello [[prop1]]!</h2>
  </template>

  <script>
    /**
     * `element-two`
     * 
     *
     * @customElement
     * @polymer
     * @demo demo/index.html
     */
    class ElementTwo extends ElementOne {
      static get is() { return 'element-two'; }
      static get properties() {
        return {
          prop1: {
            type: String,
            value: 'element-two'
          }
        };
      }
    }

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

运行polymer servepolyserve会产生以下输出:

Chrome console output

0 个答案:

没有答案