0

新しい SPA アプリケーションを開始したいのですが、ホット タオル テンプレートが非常に興味深いと感じました

左パネルと上部パネルの 2 つのナビゲーション領域が必要です。

しかし、ホットタオルのデフォルトのシェルには、ヘッダー、フッター、コンテンツの 3 つの領域しかありません。 

<div>
  <header>
    <!--ko compose: {view: 'nav'} --><!--/ko-->
  </header>
  <section id="content" class="main container-fluid">
    <!--ko compose: {model: router.activeItem, 
        afterCompose: router.afterCompose, 
        transition: 'entrance'} -->
    <!--/ko-->
  </section>
  <footer>
    <!--ko compose: {view: 'footer'} --><!--/ko-->
  </footer>
</div>

新しいエリア leftnav を追加するにはどうすればよいですか?

ありがとう

4

1 に答える 1

0

いくつかの調査の後、デュランダルがサブビューでどのように機能するかを理解しました

どのビューでも、任意の数のサブビューをインポートできます。レイアウトは、CSS を使用して div をどのように設計しスタイル設定するかだけの問題です。

左ナビゲーションを含めるには、新しい<!--ko ... -->タグを追加し、左ナビゲーションとしてレンダリングされる適切な css クラス / スタイルがあることを確認するだけです。

このようなもの

<!--ko compose: {view: 'top-nav'} --><!--/ko--> 
<!--ko compose: {view: 'left-nav'} --><!--/ko--> 
<!--ko compose: {model: router.activeItem, 
    afterCompose: router.afterCompose, 
    transition: 'entrance'} -->
<!--/ko-->
<!--ko compose: {view: 'footer'} --><!--/ko-->

<header>、 などの追加のタグは<section>必要ありません。それらは単にサブビューのトップタグにすることができます (または、好みに応じて、なくても非常にうまく機能します)。

この時点から、実際のビュー nop-nav、left-nav などをどのように定義するかが問題になります。

于 2013-04-29T07:37:16.047 に答える