小編給大家分享一下微信小程序中下拉刷新及上拉加載的示例分析,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
創(chuàng)新互聯(lián)專注于青海企業(yè)網(wǎng)站建設(shè),自適應(yīng)網(wǎng)站建設(shè),商城網(wǎng)站建設(shè)。青海網(wǎng)站建設(shè)公司,為青海等地區(qū)提供建站服務(wù)。全流程按需求定制設(shè)計(jì),專業(yè)設(shè)計(jì),全程項(xiàng)目跟蹤,創(chuàng)新互聯(lián)專業(yè)和態(tài)度為您提供的服務(wù)
1.下拉刷新的概念及應(yīng)用場景。
概念: 下拉刷新是移動端更新列表數(shù)據(jù)的交互行為,用戶通過手指在屏幕上子上而下的滑動,可以觸發(fā)頁面的下拉刷新,更新列表數(shù)據(jù)。
應(yīng)用場景: 在移動端,數(shù)據(jù)列表是常見的頁面效果,更新列表數(shù)據(jù)是最基本的頁面需求,相比于按鈕刷新,定時(shí)刷新來說,下拉刷新的用戶體驗(yàn)方便友好,已經(jīng)成為移動端刷新列表數(shù)據(jù)的最佳解決方案。
微信小程序啟動下拉刷新:
兩種方式:
1.需要在app.json 的window選項(xiàng)中或頁面配置中開啟enablePullDownRefresh, 但是,一般情況下,推薦在頁面配置中為需要的頁面單獨(dú)開啟下拉刷新行為。
2.可以通過wx.startPullDownRefresh() 觸發(fā)下拉刷新,調(diào)用后觸發(fā)下拉刷新動畫,效果與用戶手動下拉刷新一致。
配置下拉刷新窗口的樣式:
需要在app.json 的window選項(xiàng)中或頁面配置中修改backbroundColor 和backgroundTextStyle 選項(xiàng)。
backgroundColor: 用來配置下拉刷新窗口的背景顏色,僅支持16進(jìn)制顏色值。
backgroundTextStyle 用來配置下拉刷新loading 的樣式,僅支持dark和light
onPullDownRefresh: 頁面相關(guān)事件處理函數(shù)--監(jiān)聽用戶下拉操作時(shí)執(zhí)行
停止下拉刷新效果:
當(dāng)處理萬下拉刷新后,下拉刷新的loading 效果會一直顯示,不會主動消失,需要手動隱藏下拉刷新的loading效果,此時(shí),跳用wx.stopPullDownRefresh()可以停止當(dāng)前頁面的下拉刷新。
上拉加載更多
1.上拉加載更多的概念及應(yīng)用場景。
概念: 在移動端,隨著手指不斷向上滑動,當(dāng)內(nèi)容將要到達(dá)屏幕底部的時(shí)候,頁面會隨之不斷的加載后續(xù)內(nèi)容,知道沒有新內(nèi)容位置,我們稱之為上拉加載更多,上拉加載更多的本質(zhì)就是數(shù)據(jù)的分頁加載。
應(yīng)用場景: 在移動端,列表數(shù)據(jù)的分頁加載,首選的實(shí)現(xiàn)方式就是上拉加載更多。
配置上拉觸底的距離:
可以在app.json的window 選項(xiàng)上或頁面配置中設(shè)置觸底的距離 onReachBottomDistance 單位為px,默認(rèn)觸底距離為50px。
監(jiān)聽上拉觸底事件:onReachBottom() 函數(shù),可以監(jiān)聽用戶在當(dāng)前頁面的上拉觸底事件,從而實(shí)現(xiàn)上拉加載更多列表數(shù)據(jù)的效果。
以上是“微信小程序中下拉刷新及上拉加載的示例分析”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對大家有所幫助,如果還想學(xué)習(xí)更多知識,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!
網(wǎng)頁標(biāo)題:微信小程序中下拉刷新及上拉加載的示例分析
URL標(biāo)題:http://aaarwkj.com/article14/iggpde.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供面包屑導(dǎo)航、網(wǎng)站維護(hù)、靜態(tài)網(wǎng)站、品牌網(wǎng)站建設(shè)、手機(jī)網(wǎng)站建設(shè)、網(wǎng)站收錄
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)