微信小程序云开发-列表下拉刷新
一、json文件开启页面刷新
开启页面刷新。在页面的json文件里配置两处:
- "enablePullDownRefresh": true, //true代表开启页面下拉刷新
- "backgroundColor": "#d3d3d3" //背景色设置为灰色,可以看到下拉刷新的效果
{
"usingComponents": {},
"navigationBarTitleText": "列表下拉刷新",
"enablePullDownRefresh": true,
"backgroundColor": "#d3d3d3"
}
二、在页面里监听用户下拉刷新的动作
在page({ })里面的onPullDownRefresh()方法来监听用户刷新
//监听用户下拉动作
onPullDownRefresh(){
console.log("下拉刷新的监听");
}
三、监听到用户刷新的时候重新请求最新数据
- wx.startPullDownRefresh() //页面加载的时候,开始页面刷新动画
- wx.stopPullDownRefresh() //数据请求成功后,停止页面刷新动画
Page({
//获取列表信息
getList(){
wx.cloud.database().collection("goods")
.get()
.then(res=>{
console.log("请求成功",res);
wx.stopPullDownRefresh() //数据请求成功后,停止页面刷新动画
this.setData({
list:res.data
})
})
.catch(err=>{
console.log("请求失败",err);
})
},
//页面加载的时候,调用getList获取列表信息
onLoad: function (options) {
wx.startPullDownRefresh() //页面加载的时候,开始页面刷新动画
this.getList()
}, //监听用户下拉动作
onPullDownRefresh(){
console.log("下拉刷新的监听");
//下拉刷新的时候,调用getList获取列表信息
this.getList()
} })
四、效果
微信小程序云开发-列表下拉刷新的更多相关文章
- 微信小程序scroll-view不能实现下拉刷新
一般在列表展示页面,会使用到上拉加载和下拉刷新功能,在scroll-view中有bindscrolltolower事件,可以实现上拉加载功能,但是却没法实现下拉刷新. 如需同时使用两种功能,解决步骤如 ...
- 微信小程序(2)--下拉刷新和上拉加载更多
下拉刷新 1.首先在.json文件中配置(如果在app.json文件中配置,那么整个程序都可以下拉刷新.如果写在具体页面的.json文件中,那么就是对应的页面下拉刷新.) 具体页面的.json文件: ...
- 微信小程序云开发-列表数据分页加载显示
一.准备工作 1.创建数据库nums,向数据库中导入108条数据 2.修改数据库表nums的权限 二.新建页面ListPaginated 1.wxml文件 <!-- 显示列表数据 --> ...
- 技本功丨收藏!斜杠青年与你共探微信小程序云开发(下篇)
2019年2月26日,人们为了一个杯子疯了一天. 星巴克猫爪杯,一场已经与猫无关了的“圣杯战争“.网上的倒卖价格,已炒至近千元! 求而不得,舍而不能,得而不惜.这是人最大的悲哀... 所以,请珍惜以下 ...
- 第一章 “我要点爆”微信小程序云开发之项目建立与我的页面功能实现
第一章 “我要点爆”微信小程序云开发之项目建立与我的页面功能实现 开发环境搭建 使用自己的AppID新建小程序项目,后端服务选择小程序·云开发,点击新建,完成项目新建. 新建成功后跳转到开发者工具界面 ...
- 微信小程序云开发-从0打造云音乐全栈小程序
第1章 首门小程序“云开发”课程,你值得学习本章主要介绍什么是小程序云开发以及学习云开发的重要性,并介绍项目的整体架构,真机演示项目功能,详细介绍整体课程安排.课程适用人群以及需要掌握的前置知识.通过 ...
- 微信小程序之自定义select下拉选项框组件
知识点:组件,animation,获取当前点击元素的索引与内容 微信小程序中没有select下拉选项框,所以只有自定义.自定义的话,可以选择模板的方式,也可以选择组件的方式来创建. 这次我选择了组件, ...
- 第六章 “我要点爆”微信小程序云开发实例之爆文详情页制作
爆文详情页制作 从首页中数据列表打开相应详情页面的方法: 给数据列表中每个数据项加一个点击事件,同时将当前数据项的id暂时记录在本地,然后跳转到详情页面detail goopen: function ...
- “我要点爆”微信小程序云开发实例
使用云开发进行微信小程序“我要点爆”的制作 下一章:“我要点爆”微信小程序云开发之项目建立与我的页面功能实现 接下来我将对“我要点爆”微信小程序进行完整的开源介绍 小程序名称: 我要点爆 查看方式:从 ...
随机推荐
- 一文搞懂Ajax,附Ajax面试题
目录 前言 正文 Ajax是什么东西? 实现核心/工作原理:XMLHttpRequest对象 XMLHttpRequest大致用法 创建XMLHttpRequest对象 发送请求 服务器响应 1. r ...
- Java面试必知必会:基础
面试考察的知识点多而杂,要完全掌握需要花费大量的时间和精力.但是面试中经常被问到的知识点却没有多少,你完全可以用 20% 的时间去掌握 80% 常问的知识点. 一.基础 包括: 杂七杂八 面向对象 数 ...
- 重新整理 .net core 实践篇—————中间件[十九]
前言 简单介绍一下.net core的中间件. 正文 官方文档已经给出了中间件的概念图: 和其密切相关的是下面这两个东西: IApplicationBuilder 和 RequestDelegate( ...
- WordPress安装篇(5):源码编译安装LNMP并部署WordPress
与YUM方式安装相比,源码编译安装方式更灵活,安装过程中能自定义功能和参数,特别是在批量部署服务器又要求软件版本及配置一致时,源码编译安装的优势很明显.本文介绍如何通过源码编译方式安装Nginx1.1 ...
- 【C++】随机数,rand()与srand()函数
rand()函数 rand()会返回一随机数值, 范围在0至RAND_MAX 间.RAND_MAX定义在stdlib.h, 其值为2147483647. 测试代码: #include<cstdl ...
- 【NX二次开发】uf5945获得旋转矩阵、uf5947根据变换矩阵移动或复制对象
返回一个矩阵,可以绕任意轴旋转. 与uf5947结合可以将对象沿着任意轴进行旋转.不是所有对象都能用uf5947变换,带参的实体.部件都不可以用此函数变换.下面是旋转WCS的例子. extern Dl ...
- 搭建 MySQL 高可用高性能集群
什么是MySQL集群,什么是MySQL集群,如果你想知道什么是MySQL集群,我现在就带你研究. MySQL 是一款流行的轻量级数据库,很多应用都是使用它作为数据存储.作为小型应用的数据库,它完全可以 ...
- NOIP模拟测试19「count·dinner·chess」
反思: 我考得最炸的一次 怎么说呢?简单的两个题0分,稍难(我还不敢说难,肯定又有人喷我)42分 前10分钟看T1,不会,觉得不可做,完全不可做,把它跳了 最后10分钟看T1,发现一个有点用的性质,仍 ...
- DOS命令行(8)——netsh-网络配置命令行工具
netsh 介绍与语法 netsh(Network Shell) 是一个windows系统本身提供的功能强大的网络配置命令行工具,可用来显示与修改当前正在运行的计算机的网络配置(如:IP地址.网关.D ...
- LM-MLC 一种基于完型填空的多标签分类算法
LM-MLC 一种基于完型填空的多标签分类算法 1 前言 本文主要介绍本人在全球人工智能技术创新大赛[赛道一]设计的一种基于完型填空(模板)的多标签分类算法:LM-MLC,该算法拟合能力很强能感知标签 ...