出现的问题:

1、swiper不能自动切换(设置了autoplay)。

2、数据不匹配(需要加载的数据以改变,但是swiper里面的数据出现错误)。

3、数据匹配过后,永远切换不到第一条数据。

4、根本不能切换,手动拉也拉不动。

总之遇到了很多从来没有遇到的问题!!!问题所在就是没有真正的了解swiper提供的方法,最后根据自己需求,静下心来去看了swiper官网的方法使用,问题解决的差不多了。

真正的核心部分在

observer:true,//修改swiper自己或子元素时,自动初始化swiper
observeParents:false,//修改swiper的父元素时,自动初始化swiper
onSlideChangeEnd: function(swiper){
   swiper.update();
   mySwiper.startAutoplay();
   mySwiper.reLoop();
}

加上这串代码后,使用基本正常

mySwiper.reLoop(); 重新对需要循环的slide个数进行计算,当你改变了slidesPerView参数时需要用到,需要自动轮播的时候必须要加上;

swiper.update();  更新Swiper,这个方法包含了updateContainerSize,updateSlidesSize,updateProgress,updatePagination,updateClasses方法。也就是数据改变是重新初始化一次swiper;

mySwiper.startAutoplay(); 重新开始自动切换;

swiper-动态更改数据后轮播点击或拖动失效的更多相关文章

  1. 关于swiper动态更改,无法更新的悖论

    关于swiper动态更改,无法更新的悖论 以前都觉得swiper的使用很简单,那是因为使用swiper时都是写的数据,按照官网上介绍直接初始化swiper,随便丢一个地方初始化就ok了,但是在很多需求 ...

  2. 有关swiper动态改变数据遇到的坑(不能自动滚动,自动跟新数据,切换不正常)

    以前都觉得swiper的使用很简单,那是因为使用swiper时都是写的数据,按照官网上介绍直接初始化swiper,随便丢一个地方初始化就ok了,但是在很多需求中,我们都需要动态的改变数据,这样可能就会 ...

  3. android ArrayAdapter 如何动态更改数据

    在android开发中ListView是比较常用的组件,它以列表的形式展示具体内容,并且能够根据数据的长度自适应显示,使用adpater与listview捆绑后,有时希望在程序使用过程中能动态的更改l ...

  4. Flutter学习(8)——CheckBox多选框使用及动态更改多选框数据

    原文地址:Flutter学习(8)--CheckBox多选框使用及动态更改多选框数据 | Stars-One的杂货小窝 最近项目需求需要调整页面,记录一下实现过程 这次主要是要实现个评价页面,选择不同 ...

  5. swiper动态加载数据滑动失效,ajax执行后swiper.js的效果消失问题

    使用swiper.js做一些动效时,如果进行了ajax,并且重新把DOM写入到HTML代码中,会导致swiper.js的特效消失的问题.原因是ajax加载后,原先new 的Swiper对象,不认识新来 ...

  6. TabTopAutoLayout【自定义顶部选项卡区域(带下划线)(动态选项卡数据且可滑动)】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 自定义顶部选项卡布局LinearLayout类,实现带下划线且可滑动效果.[实际情况中建议使用RecyclerView] 备注:如果 ...

  7. TabTopAutoTextSizeLayout【自定义文字字号区域(动态选项卡数据且可滑动)】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 自定义顶部选项卡布局LinearLayout类,实现可滑动效果.[实际情况中建议使用RecyclerView] 对<TabTo ...

  8. 爬虫---selenium动态网页数据抓取

    动态网页数据抓取 什么是AJAX: AJAX(Asynchronouse JavaScript And XML)异步JavaScript和XML.过在后台与服务器进行少量数据交换,Ajax 可以使网页 ...

  9. selenium抓取动态网页数据

    1.selenium抓取动态网页数据基础介绍 1.1 什么是AJAX AJAX(Asynchronouse JavaScript And XML:异步JavaScript和XML)通过在后台与服务器进 ...

随机推荐

  1. JDK性能监控命令

    阅读原文 查看虚拟机进程:jps 命令 jps 命令可以列出所有的 Java 进程.如果 jps 不加任何参数,可以列出 Java 程序的进程 ID 以及 Main 函数短名称,如下所示. $ jps ...

  2. VS找不到头文件但是系统路径已经设置

    有时候会出现打不开Include文件的问题,但是在系统包含include路径中已经设置,编译也没问题,就是一直有错误提示 这时候可以尝试在项目上点击右键,选择“下载项目”,然后再选择加载 如果还是不行 ...

  3. 自动生成LR脚本且运行

    背景:作为一个测试,特别是性能测试,尤其在活动的测试,时间紧,有很多要测的,我们的LR11因为浏览器兼容问题全录制不了脚本了,用浏览器加代理或手机加代理录制,我感觉好麻烦 ,所以就想如果能用脚本把所有 ...

  4. 【454】ML-DL相关链接

    GD(梯度下降)和SGD(随机梯度下降) 机器学习中的Bias和Variance 机器学习之判别式模型和生成式模型 笔记 | 什么是Cross Entropy

  5. 【翻译】Flink Table Api & SQL — 配置

    本文翻译自官网:Configuration https://ci.apache.org/projects/flink/flink-docs-release-1.9/dev/table/config.h ...

  6. 大数据开发工程师面试《一》Shopee虾皮技术面

    一.项目问题 1 做了哪些项目2 使用什么技术3 哪个是你主导的项目,一共开发多少个接口,项目多长时间,数据库有多少个表 二.技术问题 1 用自己擅长的语言实现非递归单链表反转 现场手写2 Hadoo ...

  7. Java Web 应用概述

    1.java Web 应用是建立在java语言基础上的企业web应用系统,oracle公司根据行业发展和便于开发制定了一套规范:Java EE规范,截至到当前(2016.3.11)是java EE7规 ...

  8. 微信多开简单实现 WeXinMoreOpen.bat

    新建一个 WeXinMoreOpen.bat 文件,内容如下 @echo off D: cd "D:\Program Files (x86)\Tencent\WeChat" sta ...

  9. [转]System Verilog的概念以及与verilog的对比

    原文地址: http://blog.csdn.net/gtatcs/article/details/8970489 SystemVerilog语言简介 SystemVerilog是一种硬件描述和验证语 ...

  10. 推荐一款好用的json导出execl格式的文件的js工具-JsonExportExcel

    <html> <head> <meta charset="utf-8"> <title>json导出Excel</title& ...