解决小程序上点击输入框键盘弹起后弹框显示不全问题
2022-08-18 本文已影响0人
每天进步一点点5454
解决思路:给当前输入框加margin-bottom即可
1.弹窗定义获取焦点、失去焦点
2.当获取焦点时,获取当前弹窗的高度*2 给当前弹窗增加动态样式
3.失去焦点时给样式设置为0即可
data:{
marginBottom :0
}
<view style="{{ marginBottom }}">
<input placeholder="请填写邮箱" id="tip_email" bindfocus="focusvalemail" bindblur="blurvalemail"
value="{{inputvalue}}" />
</view>
focusvalemail(e){
const _this=this;
_this.setData({
marginBottom:'margin-bottom:'+e.detail.height+'rpx'
})
},
blurvalemail(){
const _this=this;
_this.setData({
marginBottom:'margin-bottom:0'
})
},