2

我正在尝试通过 Polymer 元素http://www.polymer-project.org/docs/elements/core-elements.html#core-pages中的核心页面完成页面更改检测，因此我可以加载适当的方法每个。现在，Dart 代码片段在 init 方法（应用程序启动时启动的第一个方法）中初始化。我不确定如何跟踪页面何时更改以及检测更新的好方法（因此我至少可以在下面的代码段中看到不同的 LOG 更新）。该代码与这个问题密切相关：Google Dart Pages inside Tabs。如果您需要更多信息，请告诉我。

HTML：

 <paper-tabs id="Tabs" selected="{{page}}" style='width:800px; height:50px; color:#333333;'>
      <paper-tab>Display 1</paper-tab>
      <paper-tab>Display 2</paper-tab>
    </paper-tabs>

    <core-pages selected="{{page}}">
   </core-pages>

镖：

@observable int page = 0;

var pages = shroot.querySelector("core-pages");
     pages.onChange.listen((e) {
            //keep for debugging
                 if (pages == 0) {
                   _LOG.info("properties 1 selected");
                   display();
                 } else if (pages == 1) {
                   _LOG.info("properties 2 selected");
                   display();
                 }
          });
4

2 回答 2

2

这是我用来在核心页面上获取选择更改事件的方法：

<core-pages on-core-select='{{pageChange}}' id='pager' selected="{{page}}">
  <!-- content page widgets -->
</core-pages>

然后在飞镖

void pageChange(Event e, d, _){
  e.stopPropagation();
  e.preventDefault();
  if(d['item'] is! ContentPage) return;

  if (d['isSelected']){
    d['item'].loaded();
  }else{
    d['item'].unloaded();
  }
}

ContentPage我所有的内容页面都实现了一个具有.loaded()&方法的 mixin .unloaded()，因此我提醒每个内容页面它现在被选中或未选中。我这样做是因为 core-pages 在运行时将所有内容加载到 DOM 中。

于 2014-09-30T18:23:13.940 回答
2

我找不到任何change事件core-pages或其超级类。

我认为这是最简单的方法：

  @observable int page = 0;

  void pageChanged(oldValue, newValue) {
  //keep for debugging
    if (page == 0) {
      _LOG.info("properties 1 selected");
      display();
    } else if (page == 1) {
      _LOG.info("properties 2 selected");
      display();
    }
  }

如果你更喜欢听事件，core-pagesextendscore-selector已经
发送core-select了两次取消选择（旧）和选择（新）。您需要访问事件详细信息以了解它是哪一个，并且目前这很困难，因为您需要 dart-js-interop
-core-activate在点击项目元素时触发。Not sure if it fires when the selection changes by binding and you also need access to the event.details to get which page is actually selected.

于 2014-09-30T18:06:11.073 回答