收藏
回答

软键盘弹出 底部footer自动上移 ?

底部footer 使用position:fixed固定在页面底部,通过变量的值来控制键盘弹起时是否自动上推页面,通过bindfocus来获取键盘高度,使input输入框聚焦时跟随键盘上移而不被遮挡,输入框失去焦点时触发bindblur事件,输入框恢复原位。


参考代码:

    
    
      
          
    
      发布
    
        



foucus: function (e:any{
var that = this;
that.setData({
  bottom: e.detail.height
})


},


//失去聚焦
blur:function(e:any){
var that = this;
that.setData({
bottom0


})


},


.content {
  height50vh;
}


.footer {
  height90rpx;
  width100%;
  position: fixed;
  bottom0;
}


.post-font-s {
  float: right;
  width60rpx;
  height60rpx;
  text-align: center;
  margin-right50rpx;
}


.textarea-s {
  width100%;
  height50%;
}


回答关注问题邀请回答
收藏

1 个回答

  • 华个圈圈
    华个圈圈
    2021-03-22

    输入框有个这个事件 bindkeyboardheightchange ,底部的footer如果是最底部 样式 bottom初始是0

    根据这个事件去设置footer的bottom

    2021-03-22
    有用 2
    回复
登录 后发表内容
问题标签