小程序上拉下拉共存时不可使用scroll-view的解决方法
使用 bindscrolltolower ,必须搭配使用的 scroll-view 会导致小程序 "enablePullDownRefresh": true 下拉不能使用。
解决方法,就是当两者同时存在时,改 scroll-view 为 view ,改 bindscrolltolower 为 onReachBottom 函数。
这样在上拉加载,跟下拉刷新同时存在的时候, "enablePullDownRefresh": true 就可以生效了。
- wxml
<view class="scroll-view">
<view class="view-item"><text>text1</text></view>
<view class="view-item"><text>text2</text></view>
<view class="view-item"><text>text3</text></view>
<view class="view-item"><text>text4</text></view>
<view class="view-item"><text>text5</text></view>
<view class="view-item"><text>text6</text></view>
<view class="view-item"><text>text7</text></view>
<view class="view-item"><text>text8</text></view>
<view class="view-item"><text>text9</text></view>
</view>
- wxss
.scroll-view {
height: 1300rpx;
}
.view-item {
width: 33.333333%;
height: 300rpx;
float: left;
color: #ffff;
background: #888;
}
- js
Page({
data: {
},
onLoad: function(option) {
wx.request({
},
success: function(res) {
}
});
},
// 加载数据函数
onReachBottom: function(event) {
console.log("到底了");
},
})
小程序上拉下拉共存时不可使用scroll-view的解决方法的更多相关文章
- 微信小程序上拉下拉刷新
小程序提供了,onPullDownRefresh和onReachBottom两个事件函数监听下拉和上拉事件函数.提示加载中,取消加载中 效果: js文件 // pages/enterprise/ent ...
- 史上最全的CSS hack方式一览 jQuery 图片轮播的代码分离 JQuery中的动画 C#中Trim()、TrimStart()、TrimEnd()的用法 marquee 标签的使用详情 js鼠标事件 js添加遮罩层 页面上通过地址栏传值时出现乱码的两种解决方法 ref和out的区别在c#中 总结
史上最全的CSS hack方式一览 2013年09月28日 15:57:08 阅读数:175473 做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我 ...
- 微信小程序上传后发布或者体验版测试无数据解决办法
在做微信小程序开发的过程中,发现小程序在本地调用接口的数据都显示,但是上传之后,发现手机体验没有数据.以下为解决办法: 1.先清除缓存试试. 2.打开微信小程序工具右上角的详情——项目设置,将“不校验 ...
- 微信小程序 上拉刷新/下拉加载
小程序项目中上拉刷新下拉加载是比较常见的需求,官方文档也提供了相当友好的API,但是因为API隐藏的比较深,文档描述也比较模糊所以也折腾了一番(官方文档),在此记录一下使用方式 onPullDownR ...
- 微信小程序 - 上拉加载下拉刷新
点击下载示例:小程序 - 上拉刷新下拉加载
- 全栈开发工程师微信小程序-上(下)
全栈开发工程师微信小程序-上(下) icon 图标 success, success_no_circle, info, warn, waiting, cancel, download, search, ...
- 全栈开发工程师微信小程序-上(中)
全栈开发工程师微信小程序-上(中) width: 750rpx; 750rpx代表与屏幕等宽,rpx的缩写responsive pixel,这个单位是可以根据屏幕大小进行自适应调整的像素单位. 小程序 ...
- 全栈开发工程师微信小程序 - 上
全栈开发工程师微信小程序-上 实现swiper组件 swiper 滑块视图容器. indicator-dots 是否显示面板指示点 false indicator-color 指示点颜色 indica ...
- iOS不得姐项目--精华模块上拉下拉的注意事项,日期显示,重构子控制器,计算cell的高度(只计算一次),图片帖子的显示
一.上拉下拉注意事项 使用MJRefresh中的上拉控件自动设置透明 当请求下页数据通过page的时候,注意的是上拉加载更多数据失败的问题,下拉加载数据失败了,页数应该还原.或者是请求成功的时候再将页 ...
随机推荐
- 京东2019春招Java工程师编程题题解
生成回文串 题目描述 对于一个字符串,从前开始读和从后开始读是一样的,我们就称这个字符串是回文串. 例如"ABCBA","AA","A"是回 ...
- CentOS7从U盘中拷贝文件
1. 要想从U盘中拷贝文件,必须要将U盘挂载到一个目录中,所以必须新建一个目录,一般建在/mnt下.我们执行:mkdir /mnt/usb来新建一个目录. 2. 查看U盘是否已经被识别.执行:df - ...
- 如何把百度统计代码放入JS文件中?百度统计的JS脚本原理分析
<script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script&quo ...
- hdu1060 Leftmost Digit---求N的N次方的首位(对数)
题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=1060 题目描述:求N的N次方的第一位. 思路: 第一次做这种类型的题目,学到了如何运用对数. 首先推 ...
- python自定义函数可以向前引用不用声明
#有些编程语言不够"聪明",向这类向前引用的方式会导致报错,但Python足够"醒目",这段代码是正确的! def next(): print('我在n ...
- if else if,switch case二者的联系与区别
前段时间在学习中听到了一个关于条件判断语句的问题,分析if else if语句和switch case语句这两者之间的联系和区别,从而使用其中最有效率的一种方法. 一.if...else if if. ...
- 关于myeclipse启动报错:An internal error has occurred. java.lang.NullPointerException解决办法
启动myeclipse报错,百度了一下网友处理方式,对比日志,发现现在已有的教程真的是巨人坑: 如果出现了上述的错误按照如下的3个步骤解决:1.首先关闭MyEclipse工作空间.2.然后删除工作空间 ...
- 关于 Rijndael 加密
MSDN https://msdn.microsoft.com/zh-cn/library/system.security.cryptography.rijndaelmanaged(v=vs.110) ...
- echarts.js--前端可视化数据图形
ECharts,一个使用 JavaScript 实现的开源可视化库,可以流畅的运行在 PC 和移动设备上, 兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等 ...
- SpringIOC学习二
Spring的IOC容器通过依赖注入DI(dependency injection)来实现程序之间的依赖关系,达到解耦的方式依赖的方式:a.基于xml文件配置的注入 * 构造函数注入 * ...