scroll-view其實(shí)提供了一個(gè) bindscrolltolower 事件 這個(gè)事件的作用是直接監(jiān)聽scroll-view滾動(dòng)到底部
但是 總有不太一樣的情況
公司的項(xiàng)目 scroll-view 內(nèi)部 最下面有一個(gè) 類名叫 bottombj 的元素
我希望 滾動(dòng)到這個(gè) bottombj 上面的時(shí)候就開始加載滾動(dòng)分頁 簡單說 bottombj這塊元素不參與滾動(dòng)分頁
但 bindscrolltolower 只會(huì)判斷 是否到了當(dāng)前scroll-view最底部 而無法動(dòng)態(tài)拒絕某塊元素參與
所以 我們只能寄希望于 bindscroll
首先 我們要給自己的scroll-view加一個(gè)id 方便我們?nèi)ツ沁@塊元素
這里 我直接叫 scroll-page
然后 我們在 bindscroll="bindscrolltolower"中直接這樣寫
const query = wx.createSelectorQuery()
query.select('#scroll-page').boundingClientRect()
query.exec((res) =>{
if ((e.detail.scrollHeight - e.detail.scrollTop) <= (res[0].height + 1)) {
console.log("執(zhí)行滾動(dòng)分頁邏輯");
}
});
那么 我們?nèi)绻?不想bottombjBox參與
這樣寫文章來源：http://www.zghlxwxcb.cn/news/detail-724572.html
const query = wx.createSelectorQuery()
query.select('#scroll-page').boundingClientRect()
query.select('.bottombjBox').boundingClientRect()
query.exec((res) =>{
if (((e.detail.scrollHeight-res[1].height) - e.detail.scrollTop) <= (res[0].height + 1)) {
console.log("執(zhí)行滾動(dòng)分頁邏輯");
}
});
我們只需要 通過query將 .bottombjBox 一起捕獲 因?yàn)?后捕獲的 bottombjBox 所以他是 1下標(biāo)
去和總高度減一下就好了文章來源地址http://www.zghlxwxcb.cn/news/detail-724572.html
到了這里，關(guān)于微信小程序 在bindscroll事件中監(jiān)聽scroll-view滾動(dòng)到底的文章就介紹完了。如果您還想了解更多內(nèi)容，請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
