最近使用微信小程序开发的时候,需要用scroll-view的bindscrolltolower事件,控制加载下一页的内容。但是发现在ios里,下拉滚动一次,事件触发两次,导致重复加载数据。

经过百度和亲身试验,可以采用用bool变量控制的方法解决这个问题:

1、在data中定义bool变量

//是否正在处理滚动事件,避免一次滚动多次触发
isScrolling:false

2、bindscrolltolower事件处理函数中,进入时判断是否正在处理,并设置isScrolling值为true;退出时设置isScrolling值为false

if(this.data.isScrolling===true)
return;
this.data.isScrolling=true;
//业务逻辑代码
..........
this.data.isScrolling=false;

微信小程序scroll-view滚动一次多次触发的问题解决方案的更多相关文章

  1. 微信小程序 -- scroll view

    效果图:横向滚动和纵向滚动 scroll view使用方法文档,前面已经介绍查找文档方法,此处不再赘述 一.横向滚动 创建一个页面scroll-nav 然后,在.wxml文件中排版 <!--水平 ...

  2. 解决微信小程序ios端滚动卡顿的问题

    方案1:直接使用微信小程序提供的 “scroll-view " 组件. <scroll-view scroll-y style="height: 100%;"> ...

  3. [微信小程序] 微信小程序下拉滚动选择器picker绑定数据的两种方式

    小程序 picker 多列选择器 数据动态获取 需求是将各校区对应各班级的数据 以两列选择器的方式展示出来,并且可以在选择完成之后记录选结果参数. 校区数据 和 班级数据 分别是两个接口,以 校区 t ...

  4. 微信小程序scroll-view横向滚动

    官方文档给的代码复制下来发现无法滚动,没反应,使用css设置浮动属性也无效 官方没有给出css代码,横向需要设置两个css属性才行: white-space: nowrap; ----规定段落中的文本 ...

  5. 关于微信小程序获取view的动态高度填坑

    wx.createSelectorQuery().select('#box').boundingClientRect(function (rect) { width = rect.width heig ...

  6. 微信小程序scroll标签的测试

    一:testscroll.wxml的代码如下.testview.js自动生成示例代码 //testscroll.wxml <view class="section__title&quo ...

  7. 微信小程序 左右分类滚动列表

    今天需求个类似得到app分类的功能,效果如图: 左右分别滚动,互不干扰,先把简单的布局和样式搭好. <view class="page"> <view class ...

  8. 【微信小程序】view顶部固定或底部固定 + scroll-view中的元素view也可以使用position:fixed;固定选中元素位置

    1.顶端固定核心代码如下: <view class="page__hd" style="position:fixed; top:0;width: 750rpx;&q ...

  9. 微信小程序将view动态填满全屏

    一.在app.js利用官方方法获取设备信息,将获取到的screenHeight.windowHeight度量单位统一由rpx换算为px 注:官方文档给出 [rpx换算px (屏幕宽度/750)  ][ ...

  10. 微信小程序-通知公告滚动提示

    wxml如下: <view class='scroll_view_border'> <view class="srcoll_view" bindtap=" ...

随机推荐

  1. php代码审计——DVWA

    1.命令注入: LOW等级: 输入没有任何限制,可以直接ping: Medium等级: 介绍一下str_replace()函数和array_key()函数: Str_replace(str1,str2 ...

  2. Mock.js常用占位符——Basic、Date、Color

    1. Basic 在通过占位符引用方法时, Mock.mock('@boolean')  : Mock.mock('@boolean()')  都可以调用方法 方法 含义 使用举例 Random.bo ...

  3. 未在本地计算机上注册microsoft.ace.12.0的解决办法

    (1)去http://download.microsoft.com/download/7/0/3/703ffbcb-dc0c-4e19-b0da-1463960fdcdb/AccessDatabase ...

  4. vue-cli中怎么样使用less

    1.安装安装less依赖,npm install less less-loader --save 2.修改配置文件, 在build/webpack.base.conf.js文件的module.expo ...

  5. linux bash array list

    #定义array ptpArray=()while read linedo #将文件读取内容放到array中,注意作为字符串放,否则空格会被分隔成行ptpArray+=("$line&quo ...

  6. Git版本库管理

    Step 1 查看哪些历史提交过文件占用空间较大 使用以下命令可以查看占用空间最多的五个文件: git rev-list --objects --all | grep "$(git veri ...

  7. vue-cli(vue脚手架) 简单使用

    1.vue-cli 作用 vue-cli作为vue的脚手架,可以帮助我们在实际开发中自动生成vue.js的模板工程. 2.vue-cli 使用 a. 安装全局vue-cli npm install v ...

  8. 6354 Everything Has Changed

    Edward is a worker for Aluminum Cyclic Machinery. His work is operating mechanical arms to cut out d ...

  9. python 面向对象 继承 派生 组合

    具体参考博客:http://www.cnblogs.com/linhaifeng/articles/6182264.html#_label12 一.面向对象 面向对象:对象与对象之间的相互交互,不可预 ...

  10. android控件基本布局

    <?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android=&qu ...