小程序模板網(wǎng)

微信小程序 scroll-view滾動(dòng)到底部事件不觸犯的鍋

發(fā)布時(shí)間:2018-05-29 11:03 所屬欄目:小程序開(kāi)發(fā)教程

今日準(zhǔn)備把微信小程序的下拉刷新做一下,沒(méi)想到我綁定了bindscrolltolower事件,但是居然不觸發(fā),我設(shè)置了lower-threshold高度無(wú)濟(jì)于事.最后經(jīng)過(guò)不懈的努力,找了很多資料,才發(fā)現(xiàn),居然要設(shè)置scroll-view高度,于是我在.wxss里設(shè)置了高度為100%:

.scrollStyle{
   width: 100%;
   height: 100%; 
   display: flex;
  flex-direction: column; 
}

居然無(wú)效,修改height為具體高度也無(wú)效.
然后我在 style里設(shè)置height為200px,居然生效了:

<scroll-view style='height:{{scrollHeight}}px' class='scrollStyle' scroll-y='true' slot="0" hidden="{{curindex != 0}}" bindscrolltolower="loadMoreData" lower-threshold="100">

注意:style里的height單位必須寫(xiě)px;
scrollHeight怎么來(lái)的?是獲取了屏幕高度,代碼如下:

 let  scrollHeight = wx.getSystemInfoSync().windowHeight;
    this.setData({
      scrollHeight: scrollHeight
    });

scrollHeight其實(shí)是減去導(dǎo)航欄和tabbar的高度!
ps:很啃爹只能寫(xiě)在style里才生效.


易優(yōu)小程序(企業(yè)版)+靈活api+前后代碼開(kāi)源 碼云倉(cāng)庫(kù):starfork
本文地址:http://22321a.com/wxmini/doc/course/24465.html 復(fù)制鏈接 如需定制請(qǐng)聯(lián)系易優(yōu)客服咨詢:800182392 點(diǎn)擊咨詢
QQ在線咨詢