Question

假设您在Dart中将一个Web组件存储在另一个Web组件中。有没有办法从其他组件访问状态？

假设我有一个名为x-notebook-element的Polymer元素和一个嵌入其中的x-note-element（通过迭代器）：

<polymer-element name="x-notebook-element">
  <template>
    <ul>
      <template repeat="{{note in notes}}">
        <li is="x-note-element" note="{{note}}"></li>
      </template>
    </ul>
  </template>

  <script type="application/dart" src="notebook.dart"></script>
</polymer-element>

难点在于，我希望能够点击Delete 中的x-note-element按钮，从DOM中移除x-note-element 和从note列表中删除与其关联的notes。

Answer 1

您可以在CustomEvent

中触发x-note-element

dispatchEvent(new CustomEvent('my-delete-event', detail: note.id));

听听那些事件：

<li is="x-note-element" note="{{note}}" on-my-delete-event="{{delete}}"></li>

然后在x-notebook-element的dart部分：

delete(CustomEvent e, var detail, Element target) {
  final deletedId = e.detail;
  // update notes
}

从Dart中的其他Web组件访问状态

1 个答案: