更新记录

1.0.1（2020-09-17） 下载此版本

2020-9-17：添加自动翻页功能

1.0.0（2020-09-16） 下载此版本

实现手动翻页效果 自动翻页后续添加

平台兼容性

cs_pageTurning 翻页轮播

在页面script中引入组件，并注册组件

import pageTurning from "@/components/cs-pageTurning/cs-pageTurning.vue"
export default {
    components: {pageTurning}
}

示例

<pageTurning  ref="pageTurning" :height="440" :autoplay="autoplay" :imgList="bannerList"></pageTurning>

属性

方法

nextPage() 下一页

creatTimer() 重新开启自动翻页

deleteTimer() 清除定时器 关闭自动翻页

优化

如果组件放在 tab页上 可在onshow() onhide() 上调用 开始定时器 creatTimer() 和 删除定时器 deleteTimer() 优化性能

onShow(){
    console.log("创建定时器")
    console.log(self.$refs['pageTurning']);
    if(self.autoplay && self.$refs['pageTurning']){
        self.$refs['pageTurning'].creatTimer();
    }       
},
onHide(){
    console.log("删除定时器");
    console.log(self.$refs['pageTurning']);
    if(self.$refs['pageTurning']){
        self.$refs['pageTurning'].deleteTimer();
    }
},