wx-miniapp/src/components/BannerSwiper/index.vue

<template>
  <view class="BannerSwiper">
    <swiper style="width: 100%; height: 100%;" indicator-color="rgba(255,255,255,0.3)" indicator-active-color="rgba(255,255,255,1)" :indicator-dots="true" :autoplay="true" :interval="2000" :duration="300">
      <block v-for="(item, index) in List" :key="index">
        <swiper-item>
          <view class="swiper-item">
            <view class="MainItemImg">
              <image mode="aspectFill" :src="item.image" @tap="LinkTo(item)"></image>
            </view>
          </view>
        </swiper-item>
      </block>
    </swiper>
  </view>
</template>

<script>
export default {
  name: 'BannerSwiper',
  props: {
    List: {
      default: () => {
        return []
      },
      type: Array
    }
  },
  data () {
    return {
    }
  },
  methods: {
    LinkTo (item) {
      if (item.srcId === null) return
      wx.navigateTo({ url: `../../pages/HuiShengHuo/ActivityList/ActivityDetail/index?id=${item.srcId}` })
    }
  }
}
</script>

<style>
.BannerSwiper {
  width: 100%;
  height: 100%;
}
</style>