<scroll-view class="movie-grid-container" scroll-y="true" scroll-x="false" bindscrolltolower="loadMoreMovie">
<block wx:for="{{movies}}" wx:key="{{item}}">
<view class="movie">
<template is="movieTemplate" data="{{...item}}" />
</view>
</block>
<text class="has-no-more" wx:if="{{hasNoMore}}">没有更多了</text>
</scroll-view>

  注意,此时scroll-view必须给一个高度才能实现下拉刷新。文档中也有说道此组件会使不能在组件区域内触发下拉刷新onPullDownRefresh事件。

解决办法

使用view组件,

    <view class="movie-grid-container">
<block wx:for="{{movies}}" wx:key="{{item}}">
<view class="movie">
<template is="movieTemplate" data="{{...item}}" />
</view>
</block>
<text class="has-no-more" wx:if="{{hasNoMore}}">没有更多了</text>
</view>

  此时view可不用设置高度

1. 实现下拉刷新

在.json文件中配置 "enablePullDownRefresh": true,然后在.js中

onPullDownRefresh: function(event) {
//此处可实现下拉刷新数据,刷新完数据最好 wx.stopPullDownRefresh();
},

2. 实现上拉加载更多

只需要在.js中

  onReachBottom: function(event) {
wx.showNavigationBarLoading(); //显示导航栏加载按钮
//加载完记得 wx.hideNavigationBarLoading();
}

微信小程序小程序使用scroll-view不能使用下拉刷新的解决办法的更多相关文章

  1. 微信小程序~下拉刷新PullDownRefresh

      一.onPullDownRefresh回调 代码: // http://itlao5.com onPullDownRefresh: function () { console.log('onPul ...

  2. 微信小程序 下拉刷新 上拉加载

    1.下拉刷新  小程序页面集成了下拉功能,并提供了接口,我们只需要一些配置就可以拿到事件的回调. 1. 需要在 .json 文件中配置. 如果配置在app.json文件中,那么整个程序都可以下拉刷新. ...

  3. 微信小程序开发之 下拉刷新,上拉加载更多

    本文记载了如何在微信小程序里面实现下拉刷新,上拉加载更多 先开看一下界面 大致如此的界面吧. 这个Demo使用了微信的几个Api和事件,我先列出来. 1.wx.request (获取远程服务器的数据, ...

  4. 微信小程序-自定义下拉刷新

    最近给别个公司做技术支持,要实现微信小程序上拉刷新与下拉加载更多 微信给出的接口不怎么友好,最终想实现效果类似QQ手机版 ,一共3种下拉刷新状态变化,文字+图片+背景颜色 最终实现后的效果(这里提示有 ...

  5. 微信小程序下拉刷新和上拉加载

    小程序知识点二 1.上拉加载和下拉刷新 Wxml文件 <scroll-view scroll-top="{{scrollTop}}" scroll-y="true& ...

  6. 微信小程序实战篇-下拉刷新与加载更多

    下拉刷新 实现下拉刷新目前能想到的有两种方式 1. 调用系统的API,系统有提供下拉刷新的API接口 2. 监听scroll-view,自定义下拉刷新,还记得scroll-view里面有一个binds ...

  7. 【微信小程序】scroll-view 的上拉加载和下拉刷新

    1.在微信小程序中,想到 下拉刷新 和 上拉加载,如果是整个页面都拖动的话,可以在页面配置中,配置 enablePullDownRefresh 和 onReachBottomDistance 然后在 ...

  8. 微信小程序上拉加载下拉刷新

    微信小程序实现上拉加载下拉刷新 使用小程序默认提供方法. (1). 在xxx.json 中开启下拉刷新,需要设置backgroundColor,或者是backgroundTextStyle ,因为加载 ...

  9. 微信小程序的下拉刷新

    微信小程序的下拉刷新:在page的js文件中有监听用户下拉刷新的处理函数onPullDownRefresh:function(){} //js文件中自带的处理函数,在onUnload下面,注意不要重复 ...

随机推荐

  1. 构建高可靠hadoop集群之1-理解hdfs架构

    本文主要参考 http://hadoop.apache.org/docs/r2.8.0/hadoop-project-dist/hadoop-hdfs/HdfsDesign.html 主要内容是对该文 ...

  2. php数组常用函数总结

    数组的创建 $arr1 = [ "姓名" => "张三", "籍贯" => "上海", "年龄&q ...

  3. 【坑】记录一个docker 1.13.1 build 07f3374 版本的坑

    在自家的开发环境中,一般都是直接yum安装最新的docker来做镜像和容器,没有仔细深究,一直相安无事.但这几天却发现一个惊悚的现象,新申请的两台虚机,一台安装好后正常,另一台却出现异常: docke ...

  4. python 方法解析顺序 mro

    一.概要: mor(Method Resolution Order),即方法解析顺序,是python中用于处理二义性问题的算法 二义性: 1.两个基类,A和B都定义了f()方法,c继承A和B那么C调用 ...

  5. 理解HBase

    1.HBase HBase: Hadoop Database,根据Google的Big Table设计 HBase是一个分布式.面向列族的开源数据库.HDFS为Hbase提供了底层的数据存储服务,Ma ...

  6. python内置常用高阶函数(列出了5个常用的)

    原文使用的是python2,现修改为python3,全部都实际输出过,可以运行. 引用自:http://www.cnblogs.com/duyaya/p/8562898.html https://bl ...

  7. scrapy爬取伯乐在线文章数据

    创建项目 切换到ArticleSpider目录下创建爬虫文件 设置settings.py爬虫协议为False 编写启动爬虫文件main.py

  8. ES6--Set之再理解

    Set 其实2016年就看过阮大神的ECMAScript 6 入门,当时看了Set之后,大致看懂了,但事实上根本没有理解Set到底是什么,所以更记不住,平时做项目大多用到的还是ES5的传统写法,以至于 ...

  9. 如何在windows“我的电脑”中添加快捷文件夹

    如图所示,windows中打开“我的电脑”时,原来有6个默认的文件夹,访问非常便捷,自己想再增加,可以使用“ThisPCTweaker”即可完成 操作如下图,不多解释,简单操作: 文件下载:http: ...

  10. CentOS7安装Oracle 11gR2 图文详解

    注:Oracle11gR2 X64安装 一.环境准备 安装包: 1.VMware-workstation-full-11.1.0-2496824.exe 2.CentOS-7-x86_64-DVD-1 ...