天天看點

用mintui的loadmore模闆實作上拉加載和下拉重新整理時自動觸發上拉加載事件(資料展示部分會出現一部分遮蓋)的解決

如下圖所示:展示的第一條資料被遮蓋。通過檢查是因為本身的這個模闆位置上移了,通過調整高度加上padding或者margin都是不可行的(在初始化進入頁面時顯示正常,但是在進行tab切換時則會出現多加的padding或者margin值)

用mintui的loadmore模闆實作上拉加載和下拉重新整理時自動觸發上拉加載事件(資料展示部分會出現一部分遮蓋)的解決

解決辦法:

加上在loadmore标簽中加上 :auto-fill=“false”,禁止loadmore 自動檢測并撐滿其容器即可完全展示。

<mt-loadmore class="my-loadmore":auto-fill="false"
 :top-method="loadTop" :bottom-method="loadBottom" :bottom-all-loaded="allLoaded" :top-distance="50" :bottom-distance="50" :max-distance="80" topDropText="釋放重新整理" topLoadingText="重新整理中..." bottomPullText="上拉加載更多" bottomDropText="釋放加載" ref="loadNoticeMore">
   <!-- 需要上拉加載下拉重新整理的清單内容-->
   <ul class="list-wrap" :style='{"min-height": minHeight}'>
       <li class="list-li" @click="GoNoticeDetail(item.announcementId)" v-for="item in listArr">
       名字内容
       </li>
   </ul>
</mt-loadmore>
注:加上最小高度是為了防止清單資料過少的時候上拉加載下拉重新整理出現的高度占不全屏的問題。
           

無意間出現的問題,記錄一下解決方法。