框架:uniapp vue2
问题:当点击textarea输入框后,软键盘打开,把页面推了上去,当失去焦点后,软键盘收起,但是页面还保持着被推上去的样子且无法手动拉下来
解决方法:
简述:调用输入框失去焦点时触发的方法,官方有个方法。当失去焦点的时候,给页面高度赋值她在打开软键盘时候的高度,官方也有个控制页面滚动位置的方法。
注意
在获取页面高度的时候,有多种方法,普通页面(非nvue、v-if、父子组件)都可使用官方的生命周期(onPageScroll)进行监听高度,但是由于我的页面是用了v-if的条件判断渲染出来的,所以使用了scroll-view组件里面的scroll方法来进行监听。
<scroll-view v-else-if="showPage === 'happen'" scroll-y @scroll="scroll">
......
<textarea @blur="textBlur"/>
......
</scroll-view>
scroll(event) {
this.scrollTopPX = event.detail.scrollTop
},
textBlur() {
uni.pageScrollTo({
scrollTop: this.scrollTopPX,
duration: 300,
})
},