小程式textarea的bug

官方bug

1. 微信版本 6.3.30，textarea 在列表渲染時，新增加的 textarea 在自動聚焦時的位置計算錯誤。
2. textarea 元件是由客戶端建立的原生元件，它的層級是最高的，不能通過 z-index 控制層級。
3. 請勿在 scroll-view、swiper、picker-view、movable-view 中使用 textarea 元件。

場景

1. textarea在聚焦時會定位到上個位置，當用戶輸入時又重新返回設定的位置，頁面滾動時會固定在螢幕的位置上
2. textarea沒有在scroll-view、swiper、picker-view、movable-view中使用，但是還是會存在這樣的問題
3. 首先說明一下：頁面如果page設定為overflow：scroll，會出現上述問題
4. textarea永遠在頁面的頂層，無法降低層級

解決辦法

1. 調整頁面樣式，尤其是overflow屬性的使用
2. 如果頁面存在彈出層這樣的需求，使用z-index是無法降低層級的，這是官方的bug，沒辦法解決。我採用的替代解決方法是:使用wx:if的方式控制textarea的顯示
3. 彈層如果直接是當前頁面的元素，只用在關閉彈層時修改資料狀態就行
4. 彈層如果是元件，也需要在關閉彈層時修改狀態，此時就需要元件父子間的通訊

子元件向父元件傳值

1. 子元件觸發指定方法時，傳送事件

   closeCoupon:function(){
       //do something
       this.triggerEvent("change","miomiomiomio~~~")
   }

2. 父元件監聽方法，在父元件呼叫的元素上監聽(.wxml)

   <cxCoupon id='cxCoupon' bind:change="changeCoupon"></cxCoupon>

3. 父元件監聽方法，在父元件中處理資料(.js)

   changeCoupon:function(e){
       this.setData({
           isShowRemark:e.detail
       })
   },
    
   

其他

喵喵喵~~~~