更新记录

1.0.1（2024-04-01） 下载此版本

补充说明必传项

1.0.0（2024-04-01） 下载此版本

首次发布

平台兼容性

uni-app

其他

自定义指示点 zt-pointDot

基本用法

• 指示点提供 dotType 六种类型：dotType="pointOutA"、dotType="pointOutB"、dotType="pointOutC"、dotType="pointOutD"、dotType="pointOutE"，当 pointOutNum 设置最大数字时，轮播图数组长度>=最大数字时，就会以数字形式显示指示点。通过 pointOutIsShow 设置 false 或 true，控制指示点是否显示。

API

Props

演示代码

<!-- 请注意-如例：swiperBox 必须包含 position: relative; -->
<view class="swiperBox">
    <swiper class="swiper" :indicator-dots="false" :autoplay="true" :interval="3000" :duration="1000" :circular="true" @change="changeFun">
        <swiper-item class="swiper-itemBox" v-for="(item, index) in listC" :key="index">
            <view class="swiper-item">{{ index }}</view>
        </swiper-item>
    </swiper>

    <!-- 指示点 -->
    <zt-pointDot 
    :swiperIndex="swiperIndex" 
    :bannerList="listC" 
    dotType="pointOutD" 
    pointOutJustifyContent="flex-end" 
    pointOutColor="#0099ff" 
    pointOutDefaultColor="#fff" 
    :pointOutBottom="50" 
    :pointOutNum="6"></zt-pointDot>
</view>

预览

功能预览