小程序-下拉刷新

框架---小程序配置---页面配置

属性 类型 默认值 说明

enablePullDownRefresh boolean false 是否开启当前页面下拉刷新

onReachBottomDistance number 50 页面上拉触底事件触发时距页面底部距离(px)

如果是全局都需要下拉刷星,在app.json中配置:

        {
            "window":{
                "enablePullDownRefresh":true
            }
        }

如果是指定页面(detail.wxml)需要下拉刷新,在detail.json中配置:

        "enablePullDownRefresh":true

    注意:在这里的配置会覆盖掉app.json中window中相同的配置项

    此时,在detail.js中:

            Page({
                onPullDownRefresh(){
                    // 执行请求数据的方法
                    init();
                }
            })

    此时,下拉松手后会隔一段时间才会复位,解决:

      API---界面---下拉刷新

      wx.stopPullDownRefresh()

      示例代码:

            Page({
                onPullDownRefresh () {
                    wx.stopPullDownRefresh()
                }
            })

原文地址:https://www.cnblogs.com/wuqilang/p/12076151.html

时间: 2024-10-03 01:17:03

小程序-下拉刷新的相关文章

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

1.下拉刷新  小程序页面集成了下拉功能,并提供了接口,我们只需要一些配置就可以拿到事件的回调. 1. 需要在 .json 文件中配置. 如果配置在app.json文件中,那么整个程序都可以下拉刷新.如果写在具体页面的.json文件中,那么就是对应的页面,可以下拉刷新. 具体页面的.json文件: 1 { 2 "enablePullDownRefresh": true 3 } app.json文件: 1 "window": { 2 "enablePullD

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

1.上拉加载和下拉刷新 Wxml文件 <scroll-view scroll-top="{{scrollTop}}" scroll-y="true" style="height:{{scrollHeight}}px;" bindscrolltolower="bindDownLoad" bindscroll="scroll">    <block wx:for="{{goodsLi

小程序下拉刷新

1.通过scroll-view实现 开始用scroll-view组件,通过scroll-view自带的触发下拉刷新.上拉加载事件. 在iOS下,可以正常触发,但在安卓机型下,必须先上滑一段距离再下滑,才能够触发下拉刷新事件,体验不太好.向小程序官方反馈,给我的回答是安卓机型不支持反弹效果. 上图是官网中关于scroll-view的内容,顺着思路,开始研究页面的滚动...继续改bug... 2.通过 onPullDownRefresh实现 1)需要在 .json 文件中配置.(.json 文件的格

微信小程序~下拉刷新PullDownRefresh

一.onPullDownRefresh回调 代码: // http://itlao5.com onPullDownRefresh: function () { console.log('onPullDownRefresh') this.queryData(id) }, 二.enablePullDownRefresh支持 然而=下拉触发不了js回调,需要再json中配置支持下拉刷新,即: "enablePullDownRefresh": true // 请注意是true,不是"

微信小程序开发——微信小程序下拉刷新真机无法弹回

开发工具中下拉之后页面回弹有一定的延迟,这个时间也有点久.真机测试,下拉后连回弹都没有,这个问题要解决,就得在下拉函数里加上停止下拉刷新的API,如下: /** * 下拉刷新 */ onPullDownRefresh: function(e) { this.getList() wx.stopPullDownRefresh(); } 原文地址:https://www.cnblogs.com/xyyt/p/10855817.html

微信小程序~下拉刷新真机测试不弹回的处理办法

问题描述: 下拉刷新在手机上不会自动回弹,开发工具可以 解决办法: 主动调用wx.stopPullDownRefresh /** * 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh: function () { console.log('onPullDownRefresh') // 3秒模拟数据加载 setTimeout(function () { // 不加这个方法真机下拉会一直处于刷新状态,无法复位 wx.stopPullDownRefresh() },

微信小程序下拉刷新无法弹回

在下拉刷新函数使用   wx.stopPullDownRefresh() 原文地址:https://www.cnblogs.com/zcc0912/p/11881283.html

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

微信小程序下拉滚动选择器picker绑定数据的两种方式  本地数据绑定和wx.request(OBJECT) json数据绑定 1.本地数据绑定 (对象数组) Page({ data:{ //户型 这是一个本地的对象,然后绑定到页面上 pic_array: [ { id: 13, name: '1室1厅1卫' }, { id: 14, name: '1室2厅1卫' }, { id: 15, name: '2室1厅1卫' }, { id: 16, name: '3室1厅2卫' }, { id: 1

小程序 上拉刷新/下拉加载

小程序项目中上拉刷新下拉加载是比较常见的需求,官方文档也提供了相当友好的API,但是因为API隐藏的比较深,文档描述也比较模糊所以也折腾了一番(官方文档),在此记录一下使用方式 onPullDownRefresh()  //用户下拉刷新事件,onReachBottom() //用户上拉触底事件 onPullDownRefresh和onReachBottom是小程序的页面事件,官方文档描述"需要在app.json的window选项中或页面的json文件中开启enablePullDownRefres