1

我从聚合物 1.0 开始,并创建了一个新的路由端点,如下所述。

page('/users/:name', scrollToTop, function(data) {
      app.route = 'user-info';
      app.params = data.params;
    }); 

所以如果我去用户/鲍勃它将去路由“用户信息”

在我的 index.html 中,路线定义如下

<section data-route="user-info">
   <web-homepage></web-homepage>
</section>

其中 web-homepage 是一个自定义元素。

自定义元素定义如下

<dom-module id="web-homepage">
  <template>
    This is homepage
  </template>

  <script>
    (function() {
      'use strict';

      Polymer({
        is: 'web-homepage',
        ready:function() {
           //want to get the route parameters (eg: bob) here 
        }
      });
    })();
  </script>

</dom-module>

有没有办法在ready函数中获取值路由参数“:name”,即bob?

4

1 回答 1

1

ready函数在导入和创建元素时执行。如果您在那里访问路由参数,它很可能是 null/empty/undefined。

但是,您可以将路由参数传递给元素,如下所示。

paramsinapp.params是应用程序的属性。您可以简单地将其传递给它的子元素。

index.html 应该是这样的

<section data-route="user-info">
   <web-homepage route-params=[[params]]></web-homepage>
</section>

在 web-homepage 中定义 route-params

<dom-module id="web-homepage">
  <template>
    This is homepage
  </template>

  <script>
    (function() {
      'use strict';

      Polymer({
        is: 'web-homepage',
        properties: {
          routeParams: {
            type: Object,
            observer: '_routeParamsChanged'
          }
        },
        ready:function() {
           //ready function is run during element creation. route-params will most likely be empty/null/undefined
           //Just random
           //want to get the route parameters (eg: bob) here 
        },
        _routeParamsChanged: function(newValue) {
           console.log('route params: ', newValue);
        }
      });
    })();
  </script>

</dom-module>
于 2015-11-10T18:38:17.317 回答