微信小程序組件學習中

1、輪播圖

wxml代碼：

<swiper indicator-dots="true" autoplay="true" duration="1000" bindchange="listenSwiper">
  <block wx:for="{{movies}}">     <!--循環movies數組-->
    <swiper-item>
      <view>{{item.url}}</view>  <!--顯示每一個條目的url-->
      <image src='{{item.url}}' mode="aspectFill"></image>
    </swiper-item>
  </block>
</swiper>

<swiper></swiper>: 滑塊視圖容器
<block></block>:是一個包裝元素，不會在頁面中作任何渲染，只接受控制屬性；像wx:if   wx:for等控制屬性
<swiper-item></swiper-item>:
js代碼：

Page({
  data: {
    movies: [
      { url: 'images/20130712/tooopen_17270713.jpg' },
      { url: 'images/20130617/tooopen_21241404.jpg' },
      { url: 'images/20130701/tooopen_20083555.jpg' },
      { url: 'images/20141231/sy_78327074576.jpg' }
    ]
  }
})

<swiper></swiper>屬性：

<image></image>屬性：