IOS不自動彈出鍵盤，必須手動觸發一下focus才行，不能自動呼叫，所以需要誘導使用者點選某個按鈕觸發focus，最終修改的方法，預設隱藏密碼輸入框，隱藏不能用v-if或者是v-show,用position:absolute, top:-1000,然後點選輸入密碼將top改為視窗內，並且呼叫focus的方法

程式碼如下，有問題歡迎評論

<template>
  <div class="pwdpush-box">
    <h4 class="enter-password" @click="enterPwd">輸入密碼</h4>
    <div class=
 
"phonenum-show"  :class="pushShow?'':'write-phonenum-1000'">
      <div class="write-phonenum">
        <p @click.prevent="pushShow = false">使用餘額支付 8864</p>
        <p>支付密碼：</p>
        <ul class="write-input clearfix">
          <input type="tel"  ref="input" maxlength=
 
"6" class="realInput" v-model="realInput" autofocus @keyup="getNum()"  v-focus @keydown="delNum()">
          <li v-for="disInput in disInputs"><input type="tel" maxlength="1" disabled  v-model="disInput.value"></li>
        </ul>
        <mt-button size="large" style="margin-top
 
:80px;" @click="goPay">確認支付</mt-button>
      </div>
    </div>
  </div>
</template>
<script>
import { Field,Toast ,Indicator} from 'mint-ui';
import {headerNav,bottomShow} from '../../vuex/actions/actionDoc'
export default {
  name: 'packe',
vuex: {
    actions:{
      headerNav,
bottomShow
}
  },
data(){
    return{
      messagepacket:false,
packets:[

      ],
disInputs:[{value:''},{value:''},{value:''},{value:''},{value:''},{value:''}],
realInput:'',
pushShow:false
}
  },
mounted(){
    this.headerNav(false)
    this.bottomShow(false)
  },
methods:{
    getNum(){
      for(var i=0;i<this.realInput.length;i++){
        this.disInputs[i].value=this.realInput.charAt(i)
        // 表示字串中某個位置的數字，即字元在字串中的下標。
}
    },
delNum(){
      var oEvent = window.event;
if (oEvent.keyCode == 8) {
        if(this.realInput.length>0){
          this.disInputs[this.realInput.length-1].value=''
}
      }
    },
goPay(){
        console.log(this.realInput)
    },
enterPwd(){
        this.pushShow = true;
this.$refs.input.focus()
    }
  }
}
</script>
<style lang="less" sconed>
.enter-password{
    text-align: right;
color:#1D890D;
font-size: 18px;
line-height: 2;
margin-top:20px;
padding-right: 20px;
}
  .phonenum-show{
    background: rgba(0,0,0,0.6);
position: absolute;
top:0;
right:0;
bottom:0;
left:0;
z-index: -1;
}
  .getback-title span{position: absolute;right:0;top:3px;width:15px;height:15px;display: inline-block;}
  .write-phonenum-1000{
    top:-1000px!important;
}
  .write-phonenum{
    position: absolute;
top:50%;
margin-top:-100px;
left:0;
right:0;
bottom:0;
z-index: 2;
padding:30px 10px 0;
background: #fff;
}
  .write-phonenum p{
    font-size: 14px;
margin-left:30px;
line-height:2;
}
  .write-phonenum p span{color: #3b90d1;}
  .write-input {width:312px; margin:10px auto; position: relative;}
  .write-input li{float: left;width:30px;height:30px; margin: 0 10px; border:1px solid #888888;}
  .write-input li input{-webkit-appearance: none;-moz-appearance: none;-ms-appearance: none;resize: none;outline: none;border:0;width:30px;line-height: 30px;text-align: center;height: 30px;font-size:16px;}
  .write-phonenum .mint-button--default{background: #3b90d1;color:#fff;font-family: "微軟雅黑";font-size: 14px;width:80%;margin:10px auto;}
  .realInput{
    /* Keyword values */
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
resize: none;
outline: none;
border: 0;
z-index: 3;
position: absolute;
width: 290px;
height: 30px;
line-height: 30px;
background: none;
display: block;
left: 50%;
margin-left: -145px;
top: 34px;
opacity: 0;
font-size: 0px;
caret-color: #fff;
color: #000;
text-indent: -5em;
font-size: 30px;
top:1px;
}
  input[type="tel"]:disabled{background-color: #fff;}
</style>