アプレットマイクロチャネル02 - カルーセルの幅の100％及び回転の基本構成を表示します

 

1 == " どのようにカルーセルの幅を100％取得するための表示を？
追加すると、あなたはswiper外の大きな箱を与え、大きな箱のカテゴリを与えます。
<ビュークラス =「lunbobox」> 
その後、wxssイメージ、幅の内側に配置されている： 100％;幅で設けられた大ボックスの幅：100％;ので。


 <ビュークラス =「lunbobox」> 
  < -回転が始まります！ - > 
  <Swiperインジケータドット= "{} {} indicatorDots" 
  丸
  自動再生 = "{} {}自動再生" =区間"区間{} {}" DURATION = "{} {DURATION}"> 
  <WXブロック：のために = "{} {} imgUrls"> 
    <Swiper品目> 
      <画像SRC = "アイテム{} {}" クラス = "スライド画像"幅= "750"高さ= "
 
ボックスの設定幅幅写真画像の100ように％表示
.lunbobox { 
  幅：750rpx; 
} 

スライド。 - イメージ{ 
  幅： 100％; 
}



 2 == " カルーセルベース構成項目 
   円形これは、アダプタが真のバックああ増加しないかどうかを示す

   <Swiperインジケータドット= "{{indicatorDots}}" 
  丸
  自動再生 = "{{自動再生}}" =をINTERVAL "{{間隔ザ}}" DURATION = "{{DURATION}}"を> 
  <ブロックWX：のため = "{} {} imgUrls"> 
    <Swiper品目> 
      <画像SRC = "アイテム{} {}" クラス = "スライド画像"幅= "355"高さ= "150" />
    </ swiper項目> 
  </ブロック> 
</ swiper>

// カルーセル
imgUrls：[
   'https://images.unsplash.com/photo-1551334787-21e6bd3ab135?w=750' 、
   'https://images.unsplash.com/photo-1551214012-84f95e060dee?w=750' 、
  「https://images.unsplash.com/photo-1551446591-142875a901a1?w=750」
]、
indicatorDots：真、// 真ドット表示表示するかどうかを 
自動再生する：真、      // 自動的に真の自動再生再生するかどうか 
の間隔を：5000、      // インターバル再生 
DURATION：1000、       // スライドアニメーション

 
03 ==は「</ナビゲーター>内のナビゲーションでああ<ナビゲーター>使用行く
であるビューを含むことができるラベルに似ナビゲータータグ、ラベル


04 == 「どのようにサイクル3つのナビゲーションリンクの 
PSを：WX：について「{} {}ラボ」= ループ構文ラボは、サイクルごとに二重引用符アレイ項目に循環さ注意  

  <ナビゲーターURL =「../リスト/リスト」hover- クラス = 『ホバー・ナビゲータ』 WX：のため = "{} {}ラボ"> 
    <表示> item.title {{}} </表示> 
 </ナビゲータ> // データナビゲーションリンク 
ラボ：[{ID：1、タイトル： "haha1"} 、{ID：3、タイトル： "haha2"}、{ID：3、タイトル： "haha3"}]

== 05 " CSS3 左端右端/ナビゲーション* /
.daohangbox {
表示：フレックス;
正当化・コンテンツ：スペースBETWEENを; //挟ん左側に記載され、右にBETWEEN暗記
}