微信小程序---scroll-view在蘋果手機上觸底或觸頂頁面閃動問題


在項目開發中遇到一個關於scroll-view的的問題,具體如下:

項目要求是橫向滾動,由於直接在scroll-view組件設置display:flex不生效,因此考慮直接在scroll-view下增加一個wrap,將所有的item放在wrap內,

將wrap設置為display:flex,這種方式在安卓手機不會導致任何問題,在蘋果手機樣式也不會有什么問題,但是當item的個數較多導致超出一屏,scroll-view

滑動觸底或者觸頂就會導致頁面抖動。解決方案如下:

 

sroll-view組件直接包裹item, 注意以下兩點:

  1. 一定要將scroll-view容器設置寬度,並設置white-space: nowrap;
  2. 一定要將scroll-view容器的每一項(item)都設置寬度和display:inline-block

也可以在item內再套一層,使用flex布局。

至此,問題解決。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM