с использованием основных страниц, есть ли событие с загрузкой страницы?

Question

В коллекции core-(animated)-pages мне нужна моя выбранная страница, чтобы реагировать на то, что она стала выбранной. Я не могу понять, какое событие поймать где. Пробовал простой load, но это не вызвано.

Если по умолчанию такого события нет, может ли on-core-select инициировать событие в my-element, чтобы сообщить ему, что он должен загрузить его данные?

  <core-animated-pages id="appPages" selected="{{selectedPage}}" valueattr="data-name" transitions="slide-from-right" on-core-select="{{pageSelected}}"> 
       <my-page data-name="Round 1" color="red"> 
        <div>Page 1</div> 
       </my-page> 
       <my-page data-name="Round 2" color="yellow"> 
        <div>Page 2</div> 
       </my-page> 
       <my-page data-name="Round 3" color="grey"> 
        <div>Page 3</div> 
       </my-page> 
      </core-animated-pages> 



<polymer-element name="my-page" attributes="color"> 
<template> 
    <section data-name="Round 1" layout vertical center center-justified style="background:{{color}};"> 
     <content></content> 
    </section> 
</template> 
<script> 
    Polymer('my-page', { 
     load: function (e) { 
      console.info(e) 
     } 
    }); 
</script> 

Answer 1

Основываясь на основных анимированном-страницах документации (https://www.polymer-project.org/docs/elements/core-elements.html#core-animated-pages), элемент занимает свое имя переходов и ищет элементы, содержащие то же самое слово. Например:

<core-animated-pages transitions="hero-transition"> 
    <section id="page1"> 
    <div id="hero1" hero-id="hero" hero></div> 
    </section> 
    <section id="page2"> 
     <div id="hero2" hero-id="hero" hero></div> 
    </section> 
</core-animated-pages> 

Это должно помочь вам избежать написания логики, чтобы показать/скрыть свой элемент. В документах также отображаются события, инициированные до и после перехода.

Answer 2

Похоже, есть два события, срабатывающие в разное время:

• core-animated-pages-transition-prepare и
• core-animated-pages-transition-end.

От https://github.com/Polymer/core-animated-pages:

<!-- 
    Fired before a page transition occurs. Both pages involved in the transition are visible when 
    this event fires. This is useful if there is something the client needs to do when a page becomes visible. 

    @event core-animated-pages-transition-prepare 
--> 

<!-- 
    Fired when a page transition completes. 

    @event core-animated-pages-transition-end 
-->