原生小程序踩坑

基礎庫版本2.10.1

1. 使用hidden無效

<div hidden="true">隱藏的</div>

說明:

由於是H5代碼遷移所以存在很多div標籤,由於比較懶所以沒轉成view,在使用hidden屬性的時候遇到了問題,不會隱藏。

思考:

view標籤可以使用hidden隱藏,除了標籤特性還有自帶的樣式處理view[hidden] display: none;,因此我加了div[hidden] display: none;,結果是仍然無效。既然這樣是不是其他的操作也會無效呢?於是經過測試,給div綁定事件bindtap,結果是有效;使用wx:if,結果有效。結語,最好不要使用div標籤,使用官方提供的組件標籤,以免出現不必要的問題。

2. scroll-viewscroll-into-view失效

<scroll-view scroll-y="true" class="scroll" scroll-into-view="{{scrollViewId}}" scroll-with-animation="true" >
  <view>動態增加內容</view>
  <view hidden="{{flag}}">動態切換出現隱藏</view>
  <view hidden="{{!flag}}">動態切換出現隱藏</view>
  <view id="{{scrollViewId}}"></view>
</scroll-view>

說明:

動態增加內容的部分會每次增加內容(包含組件),動態切換出現隱藏的兩個部分交替出現和隱藏,每次變化同時進行1.內容增加;2.切換顯示隱藏內容;3.id動態變化,可以正常的帶有動畫的滾動兩次,之後就出現問題了,不能滾動到底部,有點靈異。

思考:

很多時候scroll-view有問題是因爲1.沒有給標籤高度(很多說要固定高度,不要百分比)2.scroll-into-viewid要動態設置。以前做項目時候發現要給固定高度的,不能是百分比,但是這次遇到給的百分比高度,id動態設置,可以正常的帶有動畫的滾動兩次,說明百分比的高度並沒有問題。問題的突破點在於可以正常的滾動兩次,兩次之後通過hidden控制的標籤都顯示過,下次顯示不會造成’重繪‘(自己猜想假設的詞,不知道小程序內部原理,不重繪造成的scroll-view標籤不會重新計算這個顯示內容的正確高度),因此出現了只會滾動一段但是不會到底部的現象。處理方法是把hidden替換成wx:if

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章