アプリの初期化
必要なCSSとJavaScriptファイルがリンクされたHTMLレイアウトが表示されるようになりました。次に、アプリを初期化する必要があります(例:`my-app.js`内)。
var app = new Framework7();
上記の例では、`app`変数を使用して、Framework7の初期化されたインスタンスを格納し、後で簡単にアクセスできるようにしています。`app`という名前にする必要はありません。任意の名前を使用できます。
非常に簡単でした。しかし、Framework7はパラメータを含むオブジェクトを渡すことで、初期化時にさらに多くのカスタマイズを提供します。
var app = new Framework7({
// App root element
el: '#app',
// App Name
name: 'My App',
// Enable swipe panel
panel: {
swipe: true,
},
// Add default routes
routes: [
{
path: '/about/',
url: 'about.html',
},
],
// ... other parameters
});
利用可能なすべてのアプリアパラメータのリストについては、アプリ/コアセクションを参照してください。
アプリを初期化したら、ビュー(アプリレイアウトの`<div class="view view-main">`)を初期化する必要があります。ビューは基本的に、ナビゲーションを担当するアプリルーターです。
var mainView = app.views.create('.view-main');
したがって、`my-app.js`内の最終的な初期化コードは次のようになります。
var app = new Framework7({
// App root element
el: '#app',
// App Name
name: 'My App',
// Enable swipe panel
panel: {
swipe: true,
},
// Add default routes
routes: [
{
path: '/about/',
url: 'about.html',
},
],
// ... other parameters
});
var mainView = app.views.create('.view-main');
次は?
アプリのスキャフォールディングと初期化の方法がわかりました。次に、アプリ/コアコンポーネントをチェックして、そのパラメータとメソッド、ルーターの動作、ビュー、ページ、その他のコンポーネントについて詳しく学びましょう。