1

ポリマー 1.0 から始めて、以下に示すように新しいルート エンドポイントを作成しました。

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

したがって、users/bob に移動すると、ルート「user-info」に移動します

私の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>

ルートパラメータの値「:name」、つまり準備完了関数内の bob を取得する方法はありますか?

4

1 に答える 1

1

ready関数は、要素がインポートおよび作成されたときに実行されます。そこでルート パラメータにアクセスすると、ほとんどの場合、null/空/未定義になります。

ただし、次のようにルート パラメータを要素に渡すことができます。

paramsinapp.paramsは app のプロパティです。子要素に渡すだけです。

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 に答える