swiper动态刷新后不能自动轮播

分类：uni-app

刚开始使用静态数据，自动轮播没有问题，后面使用接口获取的数据，即调用接口后刷新轮播的数据，发现数据是已经更新了，但是却不能自动轮播了，请问这是什么问题？

<swiper :autoplay="true" :circular="true" :interval="2000" :duration="1000">  
                <swiper-item v-for="item in scrollList" :key="item" item-id="'item'+index">  
                    <text>{{item}}</text>  
                </swiper-item>  
            </swiper>

//轮播数据  
            loadScrollData(e) {  

                var that = this  

                var params = {  
                    token: token,  
                    type: 30  
                }  
                Api.postRequest("app/activity/findPrizeBroadcastByType.app", params, function(result) {  
                    if (result != false) {  
                        Parse.parseScrollData(result, function(data) {  
                            // wx.stopPullDownRefresh();  
                            that.$data.scrollList = data  
                        })  
                    }  
                })  
            },

2018-12-29 20:03 1 条评论负责人:无分享

2 个回复

8***@qq.com - IT

同样的问题脑壳痛报了bug 没人回复

辛德瑞拉

这不属于bug，实例化一次就好了

2018-12-30 08:38
1***@qq.com (作者)

回复辛德瑞拉:请问要怎么实例化呢，建议像这种问题，文档里面应该说清楚才是

2018-12-30 18:43
1***@qq.com (作者)

回复辛德瑞拉:请问要怎么实例化呢,我使用一下方法实例话会报错

var mySwiper = new Swiper('.mySwiper', {

autoplay: true,

circular: true,

duration: 1000,

interval: 2000

});

2019-01-02 10:30
辛德瑞拉

回复 1***@qq.com:看下swiper文档啊，有详细的使用说明呀，你把你写的叫做mySwiper的类名换成用默认的类名试试，swiper 功能强大，还简单，引入css 和js 直接就可以用

2019-01-02 15:57
1***@qq.com (作者)

回复辛德瑞拉:我用的是uni-app的组件swiper啊，你看看我贴的代码，没有默认类名，类名是我后面自己加的，文档里没有初始化的说明，你说的引用js、css的是vue的swiper插件吗？没有找到插件的使用文档？

2019-01-03 11:57
1***@qq.com (作者)

回复辛德瑞拉:使用插件的话没有办法兼容其他平台吧

2019-01-03 12:12

1***@qq.com (作者) - 危化镖局

已经通过添加定时器解决了，在请求获取到数据之后添加定时器，修改swiper的current属性，以下是关键代码，其它部分已隐藏。

标签部分

<swiper class="mySwiper" :current="current" :autoplay="true" :circular="true" :interval="2000" :duration="1000">  
                <swiper-item v-for="(item,index) in scrollList" :key="'item' index">  
                    <text>{{item}}</text>  
                </swiper-item>  
            </swiper>

data部分

data() {  
            return {  
                current: 0  
        }  
}

js部分

setInterval(function() {  
                                if (that.current == data.length - 1) {  
                                    that.$data.current = 0  
                                } else {  
                                    that.$data.current    
                                }  
                            }, 2000);

8***@qq.com

貌似没什么用啊，我这边还是没有效果。。

2019-01-03 16:08
1***@qq.com (作者)

你怎么写的，关键代码贴出来看一下，我的js部分else里面少贴了一个++，应该是that.$data.current++，刚刚发现没写全，你是不是这里有问题。

2019-01-04 09:09

该问题目前已经被锁定, 无法添加新回复

swiper动态刷新后不能自动轮播

2 个回复

公告

相关问题

swiper动态刷新后不能自动轮播

与内容相关的链接

2 个回复

公告

相关问题