Флэш-уведомления Polymer + page.js с тостами

Я создаю приложение среднего размера с помощью Polymer и использую Polymer Starter Kit для запуска, который использует page.js для маршрутизации.

Я хочу реализовать функциональность флеш-сообщений, используя paper-toast элемент.

В других технологиях / инфраструктурах это реализуется путем проверки того, существует ли свойство при изменении маршрута... если оно существует, оно обнуляет соответствующее сообщение flash / toast.

Как... с Polymer & Page.js возможно повторить этот тип функциональности? У Page.js нет событий для измененных маршрутов.

Я могу думать только о том, чтобы создать прокси-функцию для page('/route') функция, которую я должен вызывать каждый раз, когда я хочу перейти на новую страницу, которая затем вызывает фактическую page функция. Есть ли способ лучше?

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') иначе он не пройдет через прокси.

Другие вопросы по тегам