国产亚洲精_丰满老熟好大的大bbb_男男激情做爰视频免费观看_欧美一区二区三区精品国产

vue 移動端彈出鍵盤導致頁面fixed布局錯亂

2019-7-10    seo達人

如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里

話不多說,直接上問題圖片


這里確認按鈕是fixed布局 bottom:0 彈出鍵盤之后按鈕被頂到了鍵盤上面

網上搜到的解決方案有兩種,

一種是監聽頁面高度(我采用的這種)

一種是監聽軟鍵盤事件(ios和安卓實現方式不同,未采用)

下面是實現代碼

data() {
    return {
        docmHeight: document.documentElement.clientHeight ||document.body.clientHeight,
        showHeight: document.documentElement.clientHeight ||document.body.clientHeight,
        hideshow:true  //顯示或者隱藏footer
    }
  },
watch: {
        //監聽顯示高度
      showHeight:function() {
          if(this.docmHeight > this.showHeight){
            //隱藏
              this.hideshow=false
          }else{
            //顯示
              this.hideshow=true
          }
      }
  },
mounted() {
      //監聽事件
      window.onresize = ()=>{
          return(()=>{
              this.showHeight = document.documentElement.clientHeight || document.body.clientHeight;
      })()
      }
 
  },
<div class="bottom" v-show="hideshow">
    <div class="btn">
      確認操作
    </div>
  </div>
我這里使用的是方法是:當鍵盤彈出時,將按鈕隱藏。如果必須出現按鈕的話,可以修改按鈕回歸到正常的流中。
藍藍設計m.paul-jarrel.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、網站建設 平面設計服務

日歷

鏈接

個人資料

藍藍設計的小編 http://m.paul-jarrel.com

存檔