dart - 如何引用 WebComponent 实例？

Question

我想将对在标记中创建的 WebComponent 实例的引用传递给 WebComponent 飞镖类。例如：

html:

<element name="x-container>
  <template iterate="x in xs">
    <x-content-elem>
      <x-item item="{{x}}" top-container="{{lexical-scoped-ref-to-container}}">
    </x-content-elem>
</template>
...

我正在寻找一种将 x-container 引用到 x-item.top-container 属性的方法。主要的是 x-item 可能以某种复杂的方式嵌套，因此进行动态查找可能很困难或不是很健壮。

Answer 1

您可以使用 DOM 来查找父元素。像这样的东西应该工作。

从 x-item 内部：

Container container = this.parent.xtag;

自定义元素就像页面上的一个节点。getter 返回支持页面上节点的elem.xtagDart 对象。

如果中间有其他元素，您仍然可以使用 CSS 查询来查找您正在寻找的元素。