1.上拉載入和下拉重新整理需要在json頁面中配置開啟下拉重新整理"enablepulldownrefresh":true和"onreachbottomdistance":60設定頁面上拉觸底事件觸發時距頁面底部距離,單位為px。如果不設定上拉觸底的話預設是50px
2.首先先寫乙個公共方法,**如下:
xx:function()
; var pa=0
if(page!=1)
for(var i=(pa*10)
;i< page*10;i++)
list.push
(li)
console.log
(list)
}this.setdata(
)},
3 在頁面初始化中寫入第一頁需要載入的內容`在這裡插入
onload:
function()
list.
push
(li[i]
)//把每次迴圈到的li的值陣列新增到list陣列中
} console.
log(list)
this
.setdata()
},
3.下拉重新整理頁面實現,在下拉事件中呼叫公共方法,並使它的頁數重置為1
page=
1//頁數
let t=
this
wx.showloading()
settimeout
(function()
})wx.
stoppulldownrefresh()
;},1000
)
4.上拉載入
onreachbottom:
function()
)settimeout
(function()
})},
1000
)
微信小程式 上拉重新整理和下拉載入
上拉重新整理和下拉加載有兩種方式可以實現 1.使用scroll view元件進行操作,使用自帶的scrolltoupper和scrolltolower事件可以實現。適合頁面區域性的上拉下拉。附上文件 2.使用page頁面事件處理函式 onpulldownrefresh 下拉重新整理 和 onreac...
微信小程式下拉重新整理和上拉載入更多
因為專案裡面,經常會用到此功能,所以我們封裝乙個外掛程式。裡面應用到vant的元件 1.在compontent裡面建立乙個檔案,名字隨意 布局檔案 message scroll view client pool list scroll y lower threshold 1 bindtouchsta...
微信小程式下拉重新整理
使用了幾個方案,發現幾個注意點需要注意一下 方案一 整個布局只使用乙個scroll view,類目和列表放到該控制項下,這種狀態下重新整理可以,但是類目不能固定在頂部 方案二 整個布局使用乙個scroll view,裡面再巢狀使用scroll view,這種狀態下上拉幅度大的時候也會觸發下拉重新整理...