微信小程序下拉刷新組件加載圖片(三個(gè)小點(diǎn))不顯示刷新?tīng)顟B(tài)的問(wèn)題

更新時(shí)間：2022年10月10日 10:53:16 作者：早起的年輕人

很多朋友跟小編反饋這樣一個(gè)問(wèn)題，微信小程序中列表頁(yè)面下拉刷新，頂部不顯示三個(gè)小點(diǎn)的刷新?tīng)顟B(tài)，今天通過(guò)本文給大家介紹下小程序下拉刷新不了的解決方法，感興趣的朋友跟隨小編一起看看吧

1 微信小程序?qū)崿F(xiàn)下拉刷新

1.1 首先是在對(duì)應(yīng)的頁(yè)面 json 中添加配置

核心：

 "enablePullDownRefresh":true,
  "backgroundTextStyle": "dark"

完整的

{
  "usingComponents": {},
  "navigationBarTitleText": "采集列表",
  "enablePullDownRefresh":true,
  "backgroundTextStyle": "dark"
}

1.2 然后在頁(yè)面對(duì)應(yīng)的js中處理 onPullDownRefresh 函數(shù)

    /**
     * 頁(yè)面相關(guān)事件處理函數(shù)--監(jiān)聽(tīng)用戶(hù)下拉動(dòng)作
     */
    onPullDownRefresh: function () {
        this.onRefresh()
    },

    onRefresh:function(){
        //導(dǎo)航條加載動(dòng)畫(huà)
        wx.showNavigationBarLoading();
        //重置分頁(yè)加載頁(yè)面
        this.data.current_page=1
        //網(wǎng)絡(luò)請(qǐng)求數(shù)據(jù)
        this.getManagerSampleListFunction()
        //超時(shí)隱藏
        setTimeout(function () {
            wx.hideNavigationBarLoading();
            //停止下拉刷新
            wx.stopPullDownRefresh();
        }, 2000);
    },

本次分享使用的網(wǎng)絡(luò)請(qǐng)求框架為 fly 框架，會(huì)在近期給大家分享

  //網(wǎng)絡(luò)請(qǐng)求數(shù)據(jù)
   getManagerSampleListFunction() {
       api.fetchManngerSampleList().then(res => {
           //停止下拉刷新
           wx.hideNavigationBarLoading();
           //停止下拉刷新
           wx.stopPullDownRefresh();
           //處理數(shù)據(jù) 
           if (this.data.current_page == 1) {
               
           } else {
               
           }
       })
   },

到此這篇關(guān)于微信小程序下拉刷新組件加載圖片(三個(gè)小點(diǎn))不顯示刷新?tīng)顟B(tài)的問(wèn)題的文章就介紹到這了,更多相關(guān)小程序下拉刷新不了內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

相關(guān)文章

JavaScript構(gòu)建自己的對(duì)象示例
這篇文章主要介紹了JavaScript構(gòu)建自己的對(duì)象,結(jié)合實(shí)例形式分析了javascript自定義類(lèi)的定義與對(duì)象的實(shí)例化相關(guān)操作技巧,需要的朋友可以參考下
2016-11-11
RequireJS多頁(yè)面應(yīng)用實(shí)例分析
這篇文章主要介紹了RequireJS多頁(yè)面應(yīng)用實(shí)例分析的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2016-06-06
微信小程序?qū)崿F(xiàn)婚禮邀請(qǐng)函全部流程
本文介紹了如何使用微信小程序技術(shù)制作個(gè)性化的婚禮邀請(qǐng)函,包括頁(yè)面布局、交互設(shè)計(jì)和多媒體資源整合,詳細(xì)闡述了從功能需求到頁(yè)面設(shè)計(jì)、測(cè)試優(yōu)化以及發(fā)布流程的全面開(kāi)發(fā)步驟,通過(guò)本項(xiàng)目,可以提升創(chuàng)意設(shè)計(jì)和用戶(hù)體驗(yàn)優(yōu)化的能力,需要的朋友可以參考下
2024-10-10
微信小程序之分享頁(yè)面如何返回首頁(yè)的示例
這篇文章主要介紹了微信小程序之分享頁(yè)面如何返回首頁(yè)的示例，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2018-03-03
微信小程序開(kāi)發(fā)之麥克風(fēng)動(dòng)畫(huà) 幀動(dòng)畫(huà) 放大淡出
本篇文章主要介紹了微信小程序開(kāi)發(fā)之麥克風(fēng)動(dòng)畫(huà)：幀動(dòng)畫(huà)、放大、淡出的相關(guān)資料。具有很好的參考價(jià)值。下面跟著小編一起來(lái)看下吧
2017-04-04
javascript if條件判斷方法小結(jié)
今天在為網(wǎng)站增加一些代碼功能的時(shí)候，需要用到if條件判斷，發(fā)現(xiàn)簡(jiǎn)寫(xiě)方法忘了，這里特整理下
2014-05-05
詳解Chart.js輕量級(jí)圖表庫(kù)的使用經(jīng)驗(yàn)
這篇文章主要介紹了詳解Chart.js輕量級(jí)圖表庫(kù)的使用經(jīng)驗(yàn)，Chart.js很容易上手，只需要在頁(yè)面中引用腳本文件，并創(chuàng)建 <canvas> 節(jié)點(diǎn)即可渲染出圖表，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2018-05-05
TypeScript中的 ! 和 ? 操作符
在 TypeScript 中,!?和???是兩個(gè)非常重要且常用的操作符,分別用于非空斷言和可選鏈操作,下面就來(lái)具體介紹一下如何使用,具有一定的參考價(jià)值,感興趣的可以了解一下
2025-02-02
JavaScript對(duì)象創(chuàng)建模式實(shí)例匯總
這篇文章主要介紹了JavaScript對(duì)象創(chuàng)建模式,結(jié)合實(shí)例形式總結(jié)分析了JavaScript常見(jiàn)的對(duì)象創(chuàng)建模式,包括工廠模式、構(gòu)造函數(shù)模式、原型模式、動(dòng)態(tài)原型模式、寄生構(gòu)造函數(shù)模式、穩(wěn)妥構(gòu)造函數(shù)模式等,需要的朋友可以參考下
2016-10-10
Javascript獲取background屬性中url的值
Javascript獲取CSS中屬性值方法有很多，今天工作的時(shí)候遇到了一個(gè)問(wèn)題是需要利用Javascript獲取css中background-img屬性u(píng)rl的值，通過(guò)查閱網(wǎng)站的資料找到了解決方法，現(xiàn)在將方法分享給大家，有需要的朋友們們可以參考借鑒，下面來(lái)一起看看吧。
2016-10-10