升级到Polymer2.0时，应该使用什么来替换Polymer.Element中的Polymer.Element()

Question

我有一个poly1元素，它使用queryEffectiveChildren()来检查槽的DOM是否被填充：

if(this.queryEffectiveChildren('[slot="description"]').childElementCount > 0) {

queryEffectiveChildren函数在Polymer2.0的Polymer.Element中是不可用的，所以我应该使用什么来执行上面的检查？

Answer 1

您可以使用Polymer.LegacyElementMixin使用queryEffectiveChildren (或其他遗留API)：

customElements.define('x-foo', class extends Polymer.LegacyElementMixin(Polymer.Element) {
  connectedCallback() {
    super.connectedCallback();
    let x = this.queryEffectiveChildren('[slot="description"]');
    // ...
  }
});

演示

或等效值，如2.0升级指南中所描述的

customElements.define('x-foo', class extends Polymer.LegacyElementMixin(Polymer.Element) {
  connectedCallback() {
    super.connectedCallback();
    let x = Polymer.FlattenedNodesObserver
              .getFlattenedNodes(this)
              .filter(n => n.nodeType === Node.ELEMENT_NODE)
              .filter(n => n.parentNode.querySelector('[slot="description"]') === n);
              // OR: .filter(n => n.getAttribute('slot') === 'description');
  }
});

演示