Question

我正在使用Polymer构建一个中型应用程序，并使用Polymer Starter Kit开始使用page.js进行路由。

我想使用paper-toast元素实现Flash消息功能。

在其他技术/框架中，这是通过检查路由更改时是否存在属性来实现的。如果存在，则会显示相关的flash / toast消息。

如何...与Polymer＆amp; Page.js是否可以复制此类功能？ Page.js似乎没有任何改变路线的事件。

我能想到的唯一方法是为page('/route')函数创建一个代理函数，每当我想要转到一个新页面然后调用实际的page函数时，我必须调用它。还有更好的方法吗？

Answer 1

我暂时实现了这个目标......似乎还可以，但如果有人能提出改进请告诉我。

在routing.html

window.addEventListener('WebComponentsReady', function() {
    // Assign page to another global object
    LC.page = page;

    // Define all routes through this new object
    LC.page('/login', function () {
      app.route = 'login';
      app.scrollPageToTop();
    });

  ....
   //implement remaining routes

   // page proxy... to intercept calls
    page = function(path) {
      // dispatch event
      document.dispatchEvent(new Event('LC.pageChange', {path: path}));
      // call the real page
      LC.page(path);
    }; 
});

然后你想听的地方..在我的情况下，在lc-paper-toast元素添加到应用程序的index.html文件中，我现在可以在页面更改时收听......

 ready: function() {
      document.addEventListener('LC.pageChange', function(e){
        console.log('page change' , e);
      }, false);
    }

唯一需要注意的是，必须使用page('/route')调用所有页面更改，否则它将无法通过代理。

Polymer + page.js闪光通知，带有纸质吐司

1 个答案: