思路：监听键盘弹出和隐藏 去动态给父容器设置height为滚动scrollHeight值，隐藏设为auto,父元素设置 style="height: auto"

 

直接上代码

 

// 系统判断

export function isIOS() {

    let isIphone = navigator.userAgent.includes('iPhone')

    let isIpad = navigator.userAgent.includes('iPad')

    return isIphone || isIpad

}

// 页面加载完或者需要监听的地方调用

this.$nextTick(() => {

                if (isIOS()) {

                    console.log('ios系统')

                    console.log('container', this.$refs["container"]);

                    console.log('container' + this.$refs["container"].style.height)

                    // ios 软键盘弹出的事件处理

                    document.body.addEventListener('focusin', () => {

                        console.log('键盘弹起')         

                        console.log('height' + this.$refs["container"].style.height)

                        let scrollheight = document.documentElement.scrollHeight + 400 +"px"

                        _this.$nextTick(() => {

                            console.log('scrollHeight', scrollheight);

                            _this.$refs["container"].style.height = pxToRem(scrollheight)

                        })      

                        // this.$forceUpdate()

                    })

                

                    // ios 软键盘收起的事件处理

                    document.body.addEventListener('focusout', () => {

                        console.log('键盘收起')

                        this.$refs["container"].style.height = "auto"

                        console.log('height' + this.$refs["container"].style.height)

                        

                    })

                } else {

                    console.log('安卓系统')

                }

            })