4

使用 Polymer.Dart 构建单页应用程序，我在想实现双向 EventBus 的最佳方式

从孩子<polymer-element>我将使用fireand asyncFire。从父级<polymer-element>我将使用window.on['*'].listen.

由于<polymer-element>被封装，没有事件会在元素本身之外冒泡。

import 'package:polymer/polymer.dart';
import 'dart:html';

@CustomTag('click-counter')
class ClickCounter extends PolymerElement {
  @published int count = 0;

  ClickCounter.created() : super.created() {
    this.shadowRoot.addEventListener('click', (e) {
      if(e.target is AnchorElement) {
        AnchorElement anchor = e.target;
        this.asyncFire('ce', detail: "Anchor ${anchor.pathname}", canBubble: true);
        e.preventDefault();
      }
    }, true);
  }

  void increment(Event event, var detail, Node target) {
    count++;
    this.asyncFire('ce', detail: "Click...$count..", canBubble: true);
  }
}

例如，为了捕获所有点击事件，并传递给fireand asyncFire，是捕获所有点击事件的最有效方法，使用this.shadowRoot.addEventListenerand 传递给fireor asyncFire，或者是否有更好、更有效的方法来监听<polymer-element>自身.

4

1 回答 1

2

我不确定这里的确切问题是什么，但您使用的技术很好，这就是我为解决事件重定向所做的工作。

只是为了澄清一些事情，事件确实会从影子树中冒出来，但是当它们越过影子边界时，它们会重新定位到影子主机。点击事件的问题在于目标属性不是事件的一部分，而是锚标记的一部分，因此当事件被重新定位时，您将无法访问该属性。

另外，我认为行不通on['*']。我没有看到任何关于它的文档，并且对它的一些测试不起作用。相反，简单地让一个元素包含任何节点可以监听任何事件类型的元素应该可以很好地作为广播器。如果您尝试将事件通过管道传输到另一个框架，我会配置事件总线以转发一组特定的事件类型。

于 2014-05-19T22:38:26.053 回答