ポリマー2.xの：ES6クラスベースの構文、要素定義

Question

In the preview documentation hereは、次のコードビットがあります：

class MyElement extends Polymer.Element { 
    static get is() { return 'my-element' } 

私の質問は次のとおりです。最初の行にMyElementビットはmy-elementと一致する必要がありません2行目のビット？どのようにして第1のビットが第2のビットに制約されていますか？またはその逆？

Answer 1

いいえ、クラス名は、isゲッターから返される要素名とは関係ありません。例えば、クラスがXFooと要素名my-app名前を付けることができます

class XFoo extends Polymer.Element { 
    static get is() { return 'my-app'; } 
} 

customElements.define(XFoo.is, XFoo); 

クラスはまた、匿名のようになります。

customElements.define('my-app', class extends Polymer.Element { 
    static get is() { return 'my-app'; } 
}); 

customElement.define()は、それが説明していない理由であるかもしれないWeb Components Custom Elements spec、で定義されていますPolymer 2.0-preview Wikiにあります。この仕様では、クラス名に関する規定はありません。仕様の例とMDNでは、クラス名は通常、少なくとも保守性のために要素名に似ています。

• MDNインスタンス：save-buttonSaveBtn VS：

  var MySaveBtn = document.registerElement("save-button", SaveBtn); 
  

• カスタム要素スペックインスタンス：auto-embiggened対AutoEmbiggenedImage：

  customElements.define("auto-embiggened", AutoEmbiggenedImage, { extends: "img" });