こんにちは。
OnsenUIの学習中につまずいた、画面遷移の方法をまとめてみます。
画面遷移
main.js
if(page.id==='page1'){page.querySelector('#switch_button').onclick=function(){document.querySelector('#myNavigator').pushPage('page2.html',slide);};}elseif(page.id==='page2'){page.querySelector('#return_button').onclick=function(){document.querySelector('#myNavigator').popPage(slide);};};画面遷移には、pushPagepopPageメソッドを使用します。
引数にはあらかじめ作成したページと、アニメーションを指定します。(poppageにはアニメーションのみ)
アニメーションの設定
main.js
letslide={animation:'slide',onTransitionEnd:function(){}};animationには任意の値を指定できます。
OnsenUIで用意されているアニメーションは以下の４つ。
- slide
- lift
- fade
- none
