<template>
  <div>
    <van-swipe class="my-swipe" :autoplay="autoplay" indicator-color="white" :style="{background: bgColor||''}">
      <van-swipe-item v-for="(item, key) in swipeList" :key="key">
        <van-image :src="item.img" :fit="fit" width="100%" :height="height" />
      </van-swipe-item>
    </van-swipe>
  </div>
</template>

<script>
// import { Swipe, SwipeItem, Image as VanImage } from 'vant'
export default {
  name: 'DkSwipe',
  components: {
    // 'vanSwipe': Swipe,
    // 'vanSwipeItem': SwipeItem,
    // VanImage
  },
  props: {
    value: {
      default: '',
      type: String
    },
    height: {
      default: '',
      type: [Number, String]
    },
    autoplay: {
      default: 3000,
      type: [Number, String]
    },
    swipeList: {
      default: () => [],
      type: [Array]
    },
    fit: {
      default: 'fill',
      type: String
    },
    bgColor: {
      default: '',
      type: String
    }
  },
  data() {
    return {
    }
  },
  computed: { },
  watch: {
    swipeList(val) {
    }
  },
  mounted() {
  },
  methods: {

  }
}
</script>

<style scoped lang="scss">
  .my-swipe{
    .image{
      width: 100%;
    }
  }
</style>
