mpvue图片轮播遇到的问题

Posted 2020-12-03 mrrabbit

小程序官方写法：

<swiper indicator-dots="{{indicatorDots}}"
  autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}">
  <block wx:for="{{imgUrls}}">
    <swiper-item>
      <image src="{{item}}" class="slide-image" width="355" height="150"/>
    </swiper-item>
  </block>
</swiper>

我们需要把它改成：（因为vue中绑定属性需要使用v:bind）

<swiper :indicator-dots="indicatorDots"
          :autoplay="autoplay" :interval="interval" :duration="duration">
          <block v-for="(item,index) in imgUrls" :key="index">
            <swiper-item>
              <image :src="item" class="slide-image"/>
            </swiper-item>
          </block>
        </swiper>