vue使用vant中的popup层,在popup层中加搜索功能后,input框获取焦点 ios机型的软键盘不会将popup顶起来的问题

1.使用vant的popup弹出层做了一个piker的选择器,用户需要在此基础上增加筛选功能。也就是输入框
vue使用vant中的popup层,在popup层中加搜索功能后,input框获取焦点 ios机型的软键盘不会将popup顶起来的问题_第1张图片
2.可是在ios机型中,input框在获取焦点以后,ios的软键盘弹起会遮盖住我们的popup层,导致体验不是很好
3.在大佬的解答及帮助下,采用窗口滚动的方式解决此方法


          
            
          
        

4.在获取焦点时 将整个窗口的滚动高度赋值为 popup层的高度

getFocus(){
    let events = navigator.userAgent;
    // iphone手机 软键盘第一次顶不起来
    if(events.indexOf('iPhone')>-1){
      this.$nextTick(() => {
        let documents:any = document
        if(documents == undefined || documents == null){
          return
        }
        if(documents.activeElement.tagName === 'INPUT' || documents.activeElement.tagName === 'TEXTAREA'){
            window.setTimeout(function () {
            documents.scrollingElement.scrollTop = documents.querySelector('.per_class_scroll_view').scrollHeight;
          }, 200);
        }
      });
    }
  }

你可能感兴趣的:(vue.js,ios,前端)