2016-11-18 51 views
5

Po zmianie strony za pomocą linku lub przez JS ten.set ("route.path", "packages"); Metoda _routePageChagned działa dwukrotnie. Dzieje się tak również w momencie, gdy strona ładuje się po raz pierwszy.Polimer _routePageChagned uruchomiony dwukrotnie

Dzieje się tak również w domyślnym szablonie zestawu startowego do polimerów zbudowanym z interfejsu CLI.

Brakuje mi czegoś? Jak to się dzieje?

<link rel="import" href="../bower_components/polymer/polymer.html"> 
<link rel="import" href="../bower_components/app-route/app-location.html"> 
<link rel="import" href="../bower_components/app-route/app-route.html"> 
<link rel="import" href="../bower_components/iron-pages/iron-pages.html"> 
<link rel="import" href="my-icons.html"> 

<link rel="import" href="pages/my-loading.html"> 

<dom-module id="my-app"> 
    <template> 
    <style> 
    </style> 


    <app-location route="{{route}}"></app-location> 
    <app-route 
     route="{{route}}" 
     pattern="/:page" 
     data="{{routeData}}" 
     tail="{{subroute}}"></app-route> 

     <iron-pages 
      id="pages" 
      selected="[[page]]" 
      attr-for-selected="name" 
      fallback-selection="view404" 
      selected-attribute="visible" 
      role="main"> 

      <my-loading name="loading"></my-loading> 
      <my-login name="login"></my-login> 
      <my-view404 name="view404"></my-view404> 
      <my-view403 name="view403"></my-view403> 
      <my-packages name="packages"></my-packages> 
     </iron-pages> 
    </template> 

    <script> 
    Polymer({ 
     is: 'my-app', 

     properties: { 
     /** 
     * The current page. 
     */ 
     page: { 
      type: String, 
      reflectToAttribute: true 
     }, 
     }, 

     observers: [ 
     '_routePageChanged(routeData.page)' 
     ], 


     _routePageChanged: function(page) { 
     console.log(page); 
     var resolvedPageUrl = this.resolveUrl('pages/my-' + page + '.html'); 
     this.importHref(resolvedPageUrl, function() { 
      this.page = page; 
     }.bind(this), undefined, false); 
     } 

    }); 
    </script> 
</dom-module> 

Odpowiedz

2

Działa to jak poprawka hakerska, wciąż nie ma pojęcia, dlaczego jest potrzebna.

_pageChange: function(page) { 
    this.debounce(function() { 
    // Load page import on demand. Show 404 page if fails 
    var resolvedPageUrl = this.resolveUrl('pages/my-' + page + '.html'); 
    this.importHref(resolvedPageUrl, 
    this._pageLoaded.bind(this, page),  // loaded callback 
    this._pageChange.bind(this, 'view404'), 
    true); 
    }.bind(this), 100); 
}