写一个微信小程序swiper滚动图片，图片上用圆形图片表示滚动到哪张图片

好的，以下是一个简单的微信小程序 swiper 滚动图片，并且使用圆形图片表示滚动到哪张图片：

1. 首先在 wxml 文件中添加 swiper 组件和圆形图片组件：

<swiper indicator-dots="{{true}}" 
  indicator-active-color="#ff0000" 
  autoplay="{{true}}" 
  circular="{{true}}" 
  interval="{{5000}}" 
  duration="{{1000}}" 
  style="height: 200px;">
  <swiper-item>
    <image src="/images/pic1.jpg" mode="aspectFill"></image>
  </swiper-item>
  <swiper-item>
    <image src="/images/pic2.jpg" mode="aspectFill"></image>
  </swiper-item>
  <swiper-item>
    <image src="/images/pic3.jpg" mode="aspectFill"></image>
  </swiper-item>
</swiper>

<view class="indicator">
  <image class="dot" wx:if="{{current == 0}}" src="/images/dot-active.png"></image>
  <image class="dot" wx:else src="/images/dot.png"></image>
  <image class="dot" wx:if="{{current == 1}}" src="/images/dot-active.png"></image>
  <image class="dot" wx:else src="/images/dot.png"></image>
  <image class="dot" wx:if="{{current == 2}}" src="/images/dot-active.png"></image>
  <image class="dot" wx:else src="/images/dot.png"></image>
</view>

2. 在 wxss 文件中添加样式：

.indicator {
  position: absolute;
  bottom: 20rpx;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  justify-content: center;
  align-items: center;
}

.dot {
  width: 10rpx;
  height: 10rpx;
  margin: 0 10rpx;
  border-radius: 50%;
}

3. 在 js 文件中添加 current 变量和 swiperChange 函数：

Page({
  data: {
    current: 0
  },
  swiperChange: function (e) {
    this.setData({
      current: e.detail.current
    })
  }
})

4. 在圆形图片组件中使用 wx:if 和 wx:else 判断当前所在的图片位置，从而显示对应的圆形图片。

以上就是一个简单的微信小程序 swiper 滚动图片，并且使用圆形图片表示滚动到哪张图片的实现方法。