小編給大家分享一下微信小程序如何實現(xiàn)局部刷新觸發(fā)整頁刷新效果，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

創(chuàng)新互聯(lián)專注于運河網(wǎng)站建設(shè)服務(wù)及定制，我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗。 熱誠為您提供運河營銷型網(wǎng)站建設(shè)，運河網(wǎng)站制作、運河網(wǎng)頁設(shè)計、運河網(wǎng)站官網(wǎng)定制、成都小程序開發(fā)服務(wù)，打造運河網(wǎng)絡(luò)公司原創(chuàng)品牌,更為您提供運河網(wǎng)站排名全網(wǎng)營銷落地服務(wù)。

效果圖

如上圖所示，頭部的選項欄時固定的（fixed），下部的信息欄是滾動的, 由于頭部是fixed所以無法實現(xiàn)下拉刷新的效果，如果去掉fixed當(dāng)我們上拉的時候，選項欄又無法固定，所以我們需要監(jiān)聽頁面下拉的狀態(tài)隨時改變選項欄的狀態(tài)

1獲取滾動狀態(tài)

 onPageScroll(e) {
  this.scrollTop = e.scrollTop
 },

2信息欄監(jiān)聽下拉狀態(tài)的改變而改變自己的狀態(tài)

:class="scrollTop>0?'head-title-fixed':'head-title-absolute'"

 .head-title-absolute{
  top: 0;position: absolute;
 }
 .head-title-fixed{
  top: 0;position: fixed;
 }

以上是“微信小程序如何實現(xiàn)局部刷新觸發(fā)整頁刷新效果”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

本文標(biāo)題：微信小程序如何實現(xiàn)局部刷新觸發(fā)整頁刷新效果-創(chuàng)新互聯(lián)
當(dāng)前地址：http://weahome.cn/article/dsdpej.html