小程序textarea的bug
官方bug
- 微信版本 6.3.30,textarea 在列表渲染时,新增加的 textarea 在自动聚焦时的位置计算错误。
- textarea 组件是由客户端创建的原生组件,它的层级是最高的,不能通过 z-index 控制层级。
- 请勿在 scroll-view、swiper、picker-view、movable-view 中使用 textarea 组件。
场景
- textarea在聚焦时会定位到上个位置,当用户输入时又重新返回设置的位置,页面滚动时会固定在屏幕的位置上
- textarea没有在scroll-view、swiper、picker-view、movable-view中使用,但是还是会存在这样的问题
- 首先说明一下:页面如果page设置为overflow:scroll,会出现上述问题
- textarea永远在页面的顶层,无法降低层级
解决办法
- 调整页面样式,尤其是overflow属性的使用
- 如果页面存在弹出层这样的需求,使用z-index是无法降低层级的,这是官方的bug,没办法解决。我采用的替代解决方法是:使用wx:if的方式控制textarea的显示
- 弹层如果直接是当前页面的元素,只用在关闭弹层时修改数据状态就行
- 弹层如果是组件,也需要在关闭弹层时修改状态,此时就需要组件父子间的通信
子组件向父组件传值
子组件触发指定方法时,发送事件
closeCoupon:function(){ //do something this.triggerEvent("change","miomiomiomio~~~") }
父组件监听方法,在父组件调用的元素上监听(.wxml)
<cxCoupon id='cxCoupon' bind:change="changeCoupon"></cxCoupon>
父组件监听方法,在父组件中处理数据(.js)
changeCoupon:function(e){ this.setData({ isShowRemark:e.detail }) },
其他
魔道祖师更新啦~~~~
哈哈哈哈~
汪叽无羡~~