Framework7-navbar-app-view
Framework7-関連するアプリとビューのメソッド
説明
_View(<div class = "view">)_は、独自の設定、ナビゲーション、および履歴で構成されるアプリの切断された視覚セクションです。 すべてのビューには、異なるナビゲーションバーとツールバーのレイアウトがあります。
Viewsは、_modals_および_panels_を除くすべてのビジュアルビューのラッパーコンテナーです。 _views_がアプリの本体のメインラッパーとして設定されている場合、許可される_views_要素は1つだけです。 次のコードは、ビューのHTML構造を示しています-
_View_の初期化時に、framework7では、以下に示すようにnavbarで使用可能なメソッドを使用できます-
S.No | Methods & Description |
---|---|
1 |
myApp.hideNavbar(navbar) 特定のnavbarを非表示にするために使用されます。 _navbar_は、必要なnavbarのHTMLElementまたは文字列(CSSセレクターを使用)であり、必須パラメーターです。 |
2 |
myApp.showNavbar(navbar) 特定のnavbarを表示するために使用されます。 _navbar_は、必要なnavbarのHTMLElementまたは文字列(CSSセレクターを使用)であり、必須パラメーターです。 |
3 |
view.hideNavbar() このビューではnavbarを非表示にします。 |
4 |
view.showNavbar() このビューにはnavbarが表示されます。 |
5 |
myApp.sizeNavbars(viewContainer) Navbarの位置スタイルを再計算するために使用されます。 _viewContainer_はCSSセレクター文字列またはHTMLElementであり、iOSテーマでのみ使用されます。 |
例
次の例は、Hide Navbar(.hide-navbarクラスを使用)ボタンをクリックするとnavbarを非表示にし、Show Navbar(.show-navbarクラスを使用)ボタンをクリックしてnavbarを表示する、Framework7のビューメソッドの使用方法を示します。 。
出力
上記のコードがどのように機能するかを確認するために次の手順を実行してみましょう-
- 上記のHTMLコード navbar_app_viewl ファイルをサーバーのルートフォルダーに保存します。
- このHTMLファイルをhttp://localhost/navbar_app_viewlとして開き、出力を以下のように表示します。
- コードを実行すると、[Navbarを非表示]ボタンをクリックしてnavbarを非表示にし、[Navbarを表示]ボタンをクリックしてnavbarを表示できます。