Question

我正在尝试将事件从父级传递到Dart中的Polymer 1.0.0-rc2中的子级。问题是我不知道怎么去听孩子的事件。我试图将on-control-panel-refire属性放在notation_view.html文件的dom-module中，并从那里调用handle按钮，但它没有工作。听这个事件的正确方法是什么？我知道on-control-panel-button-pressed运作良好。

notation_view.dart

@PolymerRegister('notation-view')
class NotationView extends PolymerElement {

  NotationView.created() : super.created();

  @reflectable
  handleButton(Event e, var detail) {
    print("received");
  }
}

main_app.dart

@PolymerRegister('main-app')
class MainApp extends PolymerElement {

  MainApp.created() : super.created();

  @reflectable
  refire(Event e, var detail) {
    querySelector('notation-view').dispatchEvent(new CustomEvent("control-panel-refire",
        detail: {'name' : detail["button-id"]}));
  }

main_app.html

<link rel="import" href="notation_view.html">

<dom-module id="main-app">
  <style>
    :host {
      display: block;
    }
  </style>

  <template>
    <notation-view id="notation-view"></notation-view>
    <control-panel id="control-panel" on-control-panel-button-pressed="refire"></control-panel>
  </template>
</dom-module>

notation_view.html

<dom-module id="notation-view" >
    <style>
        :host {
          display: block;
        }
    </style>

    <template>
        <canvas id="canvas" width="1000" height="1000"></canvas>
    </template>

</dom-module>

Answer 1

我实际上没有尝试过，但我认为不是

   querySelector('notation-view').dispatchEvent(new CustomEvent("control-panel-refire",
    detail: {'name' : detail["button-id"]})); 
   }

应该是

   new PolymerDom(root).querySelector('notation-view').fire("control-panel-refire",
    detail: {'name' : detail["button-id"]}));
   }

如果分析器抱怨未知querySelector()方法，您可以将PolymerElement的结果转换为NotationView或fire()。

收听事件使用

@PolymerRegister('notation-view')
class NotationView extends PolymerElement {

  NotationView.created() : super.created();

  @reflectable
  handleButton(Event e, var detail) {
    print("received");
  }

  @Listen('control-panel-refire')
  void handleControlPanelRefire(CustomEvent e, [_] /* or `Map detail` instead of [_] */) {
    // handle event
  }

  // alternatively
  EventSubscription _controlPanelRefireSubscr;
  attached() {
    super.attached();
    _controlPanelRefireSubscr = this.on['control-panel-refire'].listen((event) {
      // handle event 
    });
  }

  detached() {
    super.detached();
    _controlPanelRefireSubscr?.cancel();
  }
}

如何监听在polymer.dart中从父节点传递给子节点的事件

1 个答案: