将路由参数传递给元素

Question

polymer-starter-kit在显示路由参数时使用了<section>，像这样：

<section data-route="user-info">
  <paper-material elevation="1">
    <h2 class="page-title">User: {{params.name}}</h2>
    <div>This is {{params.name}}'s section</div>
  </paper-material>
</section>

但我想将 params.name 数据传递给一个元素，如下所示：

<notification-section params="{{params}}" data-route="notifications"></notification-section>

虽然我可以将数据传递给元素并在其模板中将其标记出来，但我无法从任何 lifecycle events（例如 ready 访问 params 变量例如）。

如何做到这一点？

Answer 1

由于元素是从最深的子元素开始准备的，ready 事件将无法访问设置我的升序组件的数据。如果您想根据该数据对您的元素进行功能更改，您要么需要绑定到 changed 事件，要么考虑一种不同的方式来初始化该元素按 iron-pages.

框

Answer 2

您可以像这样从 "attached" 回调中访问参数

Polymer({
  is: 'notification-section',
  properties: {
    params: {
      type: Object,
    },
  },
  attached: function(e) {
    console.log('params', this.params);
  },
});

您可以阅读有关附加活动的更多信息here

我也有一个工作演示here

将路由参数传递给元素

Pass routing params to element

polymer

polymer-starter-kit