软键盘被挡

src/components/mobile/applyLogin.vue

 <template>
     <div class="dialogWrap">
         <div v-if="visible" class="transWrap" @click="handleClose(false)"></div>
-        <div v-if="visible" class="contentWrap" @click="handleClose(true)">
+        <div v-if="visible" class="contentWrap" @click="handleClose(true)" :style="{top:isInput>0?'1rem':'unset'}">
             <p>您好，</p>
             <p>欢迎来到TechBook</p>
             <el-form :model="yzCodeForm" :label-position="labelPosition" :rules="rules" ref="yzCodeForm" @keyup.enter.native="handleLogin(2,'yzCodeForm')"
                      class="demo-loginForm applyLogin">
                 <el-form-item prop="phone" label="帐号">
-                    <el-input @blur.prevent="handleToParent" v-model="yzCodeForm.phone" @input="isTruePhone" :placeholder="$t('errorValidate.errorNoAccount')" autocomplete></el-input>
+                    <el-input @blur.prevent="handleToParent" @focus="handleFocus(1)" v-model="yzCodeForm.phone" @input="isTruePhone" :placeholder="$t('errorValidate.errorNoAccount')" autocomplete></el-input>
                 </el-form-item>
                 <el-form-item prop="code" class="yzcodeItem" label="验证码">
-                    <el-input @blur.prevent="handleToParent" type="text" v-model="yzCodeForm.code" :placeholder="$t('commonTips.placeholderAccountCode')" style="float: left;" maxlength="6"
+                    <el-input @blur.prevent="handleToParent" type="text" @focus="handleFocus(2)" v-model="yzCodeForm.code" :placeholder="$t('commonTips.placeholderAccountCode')" style="float: left;" maxlength="6"
                               autocomplete></el-input>
                     <span class="getyzcodeBtn" @click="handleGetCode" v-if="showCount">{{$t("commonTips."+codehtml)}}</span>
                     <!--<span class="getdyzcodeBtn" v-if="!showCount&&lang==2">{{$t("commonTips.resendCode")}}{{count}}s</span>-->
@@ -61,6 +61,7 @@
                 isEmailOrPhone:0,
                 outSideParams:window.location.href.split("?")?window.location.href.split("?")[1]:null,
                 labelPosition:"top",
+                isInput:0,
             }
         },
         components:{
@@ -77,6 +78,7 @@
         },
         methods:{
             handleClose(data){
+                this.isInput = 0;
                 if(navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)){
                     globalMsg.$emit("scrollToTop");
                 }
@@ -88,7 +90,12 @@
                 }
             },
 
+            handleFocus(data){
+                this.isInput = data;
+            },
+
             handleToParent(){
+                this.isInput = 0;
                 if(navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)){
                     globalMsg.$emit("scrollToTop");
                 }
@@ -281,6 +288,7 @@
         position: absolute;
         bottom: 0;
         left: 0;
+        top: unset;
         width: 100%;
         background: #fff;
         overflow: auto;