1

アプリにナビゲーターとグローバル スプリッターがあります。私のナビゲーターは最初のページを tempHome としてプッシュします。スプリッターを使用するには、スプリッターのページ属性も tempHome に設定する必要があります。

<ons-navigator id="myNavigator">
  <ons-page>
    <ons-splitter>
      <ons-splitter-side id="menu" side="right" width="220px" swipe-target-width="150px" collapse swipeable>
        <ons-page>
          <ons-list>
            <ons-list-item tappable>
              test
            </ons-list-item>
          </ons-list>
        </ons-page>
      </ons-splitter-side>
      <ons-splitter-content id="content" page="tempHome"></ons-splitter-content>
    </ons-splitter>
  </ons-page>
</ons-navigator>

そのため、アプリの最初のページに tempHome が 2 回あります。

何か助けはありますか?

ありがとうございました

4

2 に答える 2

4

あなたが言及したコードペンは、ナビゲーター内のスプリッターを示しています。

ただし、ナビゲーターとスプリッターの両方に内部ページを含めることができます。そのため、あなたの場合、構造を逆に変更するだけです。常にサイド メニューを表示したい場合は、ナビゲーターの外側に配置する必要があります。

ナビゲーターを の中にons-splitter-content入れると、目的の結果が得られます。

<ons-splitter>
  <ons-splitter-side collapse swipeable>
    // menu content...
  </ons-splitter-side>
  <ons-splitter-content>
      <ons-navigator id="myNavigator" page="home.html"></ons-navigator>
  </ons-splitter-content>
</ons-splitter>

これは変更されたデモです。

補足:あなたが言及したコードペンの例を変更しただけなので、実際にはangularを使用していますが、Onsen 2の場合、angularは必須ではないことに注意してください:)

于 2016-07-30T09:29:12.160 に答える