原生小程序下拉刷新,上拉加载更多、左右翻页

本文详细介绍了在原生小程序中如何实现下拉刷新、上拉加载更多以及左右翻页功能。下拉刷新包括在json文件中开启和在Js文件中设置相应代码;上拉加载更多涉及在js文件中添加特定代码,并在相关函数中进行处理;左右翻页则需要在容器中添加指令,全局定义变量,并编写滑动逻辑函数。
摘要由CSDN通过智能技术生成

下拉刷新

(1)开启下拉刷新(json文件中)

 "enablePullDownRefresh": true

(2)在Js文件中加入如下代码

 /**
       * 页面相关事件处理函数--监听用户下拉动作
       */
    onPullDownRefresh: function () {
        wx.showNavigationBarLoading();
        this.setData({
            pageNum: 1
        });
        this.xxx();
    },`

(3)在xxx成功时加入如下代码

	`wx.hideNavigationBarLoading();
      wx.stopPullDownRefresh();`

上拉加载更多

(1)js中加入如下代码

/**
       * 页面上拉触底事件的处理函数
       */
    onReachBottom: function () {
        // 显示加载图标
        if (this.data.pageNum <this.data.last_page) {
            wx.showLoading({
                title: '玩命加载中',
            })
            // 页数+1
            this.setData({
         
  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值