アプレット3

一般的なアプリケーションおよびアプレット成分（wxml使用）

 

複数列のナビゲーションバーの一番上の行を作る1

  データ：{ 
    CONT： 0 、
    リスト：[ '1'、 '2'、 '3' ]、
    データ：[ '12312321312321312312'、 '252525252525466262426426465'、 '99999999999999999999999' ]、
  }、

  tab_btn：関数（E）{
     この。 setData（{ 
      CONT：e.target.dataset.index 
    }）
  }、

1  < ビュー> 
2    < ビュークラス= 'line_tab' > 
3      < ビューWXのための：= "{{リスト}}" WX：キー= "list_key" クラス= 'tab_context' > 
4        < ビュークラス= '{{CONT = =インデックス？"tab_on"： "「}}」データインデックス= "{{索引}}" bindtap = 'tab_btn' > {{アイテム}} </ ビュー> 
5      </ ビュー>   
6    </ ビュー>
   
     ビュー> {{DATA [CONT]}} </ ビュー> 
9    </ ビュー> 
10  </ ビュー>

.line_tab { 
  背景色：黒。
  表示：フレックス。
  フレックス方向：行。
  正当化-コンテンツ：スペースアラウンド。
  ALIGN-アイテム：センター ; 
} 
.tab_context { 
  色：白。
  ボーダー底：固体1rpx黒色。
} 
.tab_on { 
  色：burlywood。
  border-bottom：固体1rpxオレンジ。
}

 

カルーセル図2.生産：swiper

　　容器のスライダビュー（このアセンブリのみ置くswiper項目コンポーネント、放電におけるswiper項目内容の中心）