说明

ex-swiper 需要跟 ex-swiper-item 搭配使用，swiper-item 里面可以放任意内容

基础示例

<template>
  <view style="padding: 40px 0 0 0 ;">
    <ex-swiper
      :swiperItemNum="list.length"
      @change="change"
      swiperStyle="width:220px;height:300px"
    >
      <ex-swiper-item v-for="(item, index) in list" :index="index" :key="index">
        <view
          style="width: 220px;height: 300px;"
          :style="{
            'background-color': item.color,
            opacity: acIndex === index ? 1 : 0.6,
          }"
        >
        </view>
      </ex-swiper-item>
    </ex-swiper>
  </view>
</template>
<script>
export default {
  data() {
    return {
      acIndex: 0,
      list: [
        {
          name: 1,
          color: "blueviolet",
        },
        {
          name: 2,
          color: "greenyellow",
        },
        {
          name: 3,
          color: "palevioletred",
        },
        {
          name: 4,
          color: "lightgray",
        },
        {
          name: 5,
          color: "orange",
        },
      ],
    };
  },
  methods: {
    change(index) {
      this.acIndex = index;
    },
  },
};
</script>
<style lang="scss" scoped></style>

ex-swiper 属性

属性名	类型	默认值	可选值	说明
perspective	String	2700px		景深
swiperItemNum	Number			子容器滑块的数量(必须传递)
swiperStyle	String	'width:200px;height:300px'		swiper 的宽高
acIndex	Number	0		当前激活的索引
autoplay	Boolean	true	false	是否自动切换
interval	Number	2000		自动切换的间隔时长（ms）
rotateX	Number	-15		rotateX 旋转角度

ex-swiper-item 属性

属性名	类型	默认值	可选值	说明
slideItemOffSet	Number	60		偏移量
index	Number			索引 必传
showBoxReflect	Boolean	false	true	是否显示倒影
boxReflect	String	'below 10px linear-gradient(rgba(255,255,255,0),rgba(255,255,255,0.5))'		倒影样式

事件

事件名	说明
change	滑块切换事件