绑定bindchange事件的微信小程序swiper闪烁,抖动问题解决,(将微信小程序切换到后台一段时间,再打开微信小程序,会出现疯狂循环轮播,造成抖动现象)

微信小程序开发文档-组件-swiper后面追加的新闻如上图所示;
如果在bindchange事件给swiper的current属性对应的值{{current}}赋值,就会造成抖动现象。
bindchangeSwiper(event) {
console.log(event.detail);
this.setData({
current: event.detail.current
})
},
可是有的时候我们确实需要动态获取当前的swiper-item索引,用来额外做一些其他操作;
为了解决这个问题,我们需要额外定义一个变量。
current: 0, // swiper初始对应的swiper-item
currentIndex: 0, // 用来记录当前swiper对应的索引index
bindchangeSwiper(event) {
this.setData({
currentIndex: event.detail.current
})
},
这样问题解决啦!
绑定bindchange事件的微信小程序swiper闪烁,抖动问题解决,(将微信小程序切换到后台一段时间,再打开微信小程序,会出现疯狂循环轮播,造成抖动现象)的更多相关文章
- swiper在vue项目中的循环轮播bug以及点击事件
一般的,如果是静态数据(本地数据),可以直接在mounted生命周期中初始化,循环轮播.自动播放都比较正常. 但是,如果是动态从后台获取数据的话,采用上述方法会发现,轮播图无法自动播放,也无法拖拽. ...
- 记录这段时间java编程的小知识点
记录这段时间java编程的小知识点 eclipse项目导入中文乱码 eclipse左侧目录结构变动 eclipse代码段左右移动 按tal键,是整体右移. 按shift table 同时按,是整体左 ...
- 解决ajax异步请求数据后swiper不能循环轮播(loop失效)问题、滑动后不能轮播的问题。
问题描述: 1.我使用axios异步请求后台的图片进行渲染后不能实现循环轮播,也就是loop失效,但是静态写死的情况下不会出现这种问题. 2. 分析: swiper的机制是:初始化的时候将swiper ...
- JS-特效 ~ 01. 事件对象、offset偏移/检测、无缝滚动、自动循环轮播图
Math.round ( ) :正书四舍五入,负数五舍六入 用定时器,先清除定时器 事件对象 event event:事件被触动时,鼠标和键盘的状态,通过属性控制 Offset:偏移,检测 1. 获取 ...
- 最近一段时间get到的小知识(c++的)
(1)查看一个程序运行的时间 int main() { clock_t start,end; start=clock(); ... end=clock(); cout<<"Run ...
- 微信小程序之 Swiper(轮播图)
1.逻辑层 mine.js // pages/mine/mine.js Page({ /** * 页面的初始数据 */ data: { /*轮播图 配置*/ imgUrls: [ 'http://im ...
- 【云开发】10分钟零基础学会做一个快递查询微信小程序,快速掌握微信小程序开发技能(轮播图、API请求)
大家好,我叫小秃僧 这次分享的是10分钟零基础学会做一个快递查询微信小程序,快速掌握开发微信小程序技能. 这篇文章偏基础,特别适合还没有开发过微信小程序的童鞋,一些概念和逻辑我会讲细一点,尽可能用图说 ...
- 一分钟学会如何自定义小程序轮播图(蜜雪冰城Demo)
最近开发小程序项目用到了轮播图,默认的有点单调,作为后端程序员,研究一番最终实现了.本文会从思路,代码详细介绍,相信读过此文后,不管以后在开发中碰到轮播图还是需要自定义修改其他的样式都可以按这个思路解 ...
- swiper(轮播)组件
swiper是一个非常强大的组件 但是需要swiper-item这个标签来实现他想显示的内容 swiper-item标签有个item-id的属性,属性值:字符串 是swiper-item的标识符: 一 ...
随机推荐
- Day4 Numerical simulation of optical wave propagation之数字傅里叶变换
标量衍射理论是波动光学模拟的物理基础.这一理论基础的结果是将电磁波在真空中的传播作为线性系统进行处理. 对于单色波,系统观察平面的电场矢量是源平面电场矢量和自由空间脉冲响应的卷积. 因此,线性系统理论 ...
- vue通过自定义指令 v-py 将名字转拼音
自定义指令 py: 1.新建 vue-py.js文件 import Vue from 'vue'; var chinesePointCode = { "a": [21834, 38 ...
- nginx代理部署Vue与React项目
nginx代理部署Vue与React项目 一,介绍与需求 1.1,介绍 Nginx (engine x) 是一个高性能的HTTP和反向代理服务,也是一个IMAP/POP3/SMTP服务.Nginx是由 ...
- 使用Spring表达式语言进行装备--SpEL
本文主要想记录最近的两个使用spring框架实现通过配置文件装备Bean,以及使用SpEL装备Bean. 1.使用配置文件装备Bean: 当我们写某些Bean的时候是希望这个Bean当中的属性是可以通 ...
- Comparable vs Comparator
Comparable interface can be used to provide single way of sorting whereas Comparator interface is us ...
- Vivado中VIO核使用
前言 使用场景:在使用In system debug时需要使用按键触发查看相关信号,但不想用板子上的按键. VIO:Virtual input output,即虚拟IO. 主要用作虚拟IO使用:VIO ...
- 【XSY3141】哲学家 计算几何 线段树
题目描述 有一个平面,最开始平面上没有任何点. 你要按顺序加入 \(n\) 个点,求加入每个点后有多少三角形严格包含原点(在边界上不算). \(n\leq 400000\),无重点. 题解 其实这题本 ...
- JMeter测试(菜鸟级,高手莫点)
干了这么多年开发,多线程测试都是自己写程序,都不知道还有JMeter这玩意,莫笑莫笑 一个简单的测试计划如下: 在[测试计划]下创建[线程组],线程组下[HTTP请求]和[查看结果树]是必须的,[HT ...
- Count on a tree SPOJ - COT (主席树,LCA)
You are given a tree with N nodes. The tree nodes are numbered from 1 to N. Each node has an integer ...
- 题解:[APIO2007]风铃
你需要选一个满足下面两个条件的风铃:(1) 所有的玩具都在同一层(也就是说,每个玩具到天花板之间的杆的个数是一样的)或至多相差一层.(2) 对于两个相差一层的玩具,左边的玩具比右边的玩具要更靠下一点. ...