解决微信浏览器的iOS的兼容问题[软键盘弹出][input框光标]

在 input 获取焦点时获取 document.body.scrollHeight 的值并赋值给一个变量，在 input 失去焦点时设置 document.body.scrollTop 的值设置为负的该值 如果存在两个或两个以上的input框，可以设置一个当前存在聚焦 input 框的数量的值，获取焦点 +1，失去焦点 -1，只有为 0 的时候才设置 scrollTop

// template
<el-input v-model="text" @focus="onFocus" @blur="onBlur"></el-input>

// script
export default {
    data() {
        return {
            blurNum: 0,
            scrollHeight: null,
        }
    }
    methods: {
        onFocus() {
            this.blurNum ++
            if (
                navigator.userAgent.match(/iPhone/i) ||
                navigator.userAgent.match(/iPod/i)
            ){
                this.scrollHeight = document.body.scrollHeight
            },
        },
        onBlur() {
            this.$nextTick(()=>{
                if(this.blurNum===1) {
                    console.log('不上去')
                } else {
                    console.log('上去')
                    document.body.scrollTop = - this.scrollHeight
                }
                this.blurNum = 0
            }
        }
    }
}

对于第二个问题： input的光标偏上或者过宽

把 input 的 line-height值设置为和 font-size 的值一致

顺便说一下 iOS 的文本框可能会有一个灰色的上边框，是默认的阴影，给 input 设置 box-shadow 可以去掉。

box-shadow:0 0 0 rgba(0, 0, 0, 0);