近期公司因为需要把自己的项目部署到别人的服务器上,然后再自己的h5页面打开部署到别人服务器的项目,所以用到了iframe(绝逼不推荐使用,太多的坑,),然后ios上各种不兼容
找到一种兼容的方式,就是把iframe换成object,其他传值都一样,只是需要把宽高写死

 <object
                    ref="iframe"
                    :data="src"
                    height="667px"
                    width="375px"
                    
            />

上面如果不行的话,又有两种方式
第一种方式:直接判断机型是否是ios,然后如果是ios,换跳转方式为href

  getOsVersion() {
                var ua = navigator.userAgent.toLowerCase();
                var version = {};
                if (ua.indexOf("like mac os x") > 0) {
                    version.os='ios'
                    var reg = /os [\d._]+/gi;
                    var v_info = ua.match(reg);
                    version.number = (v_info + "").replace(/[^0-9|_.]/ig, "").replace(/_/ig, "."); //得到版本号9.3.2或者9.0
                    version.number = parseInt(version.number.split('.')[0]); // 得到版本号第一位
                    if(version.os=='ios'){
                        this.jumpWay=true
                    }
                    if(version.number && version.number < 10){
                        this.osUnSupport = true
                    }
                }
                if (ua.indexOf("android") > 0) {
                    version.os='android'
                    var reg = /android [\d._]+/gi;
                    var v_info = ua.match(reg);
                    version.number = (v_info + "").replace(/[^0-9|_.]/ig, "").replace(/_/ig, "."); //得到版本号4.2.2
                    version.number = parseInt(version.number.split('.')[0]);// 得到版本号第一位
                }
                return version
            },

if(this.jumpWay){
                 this.isLoading = false
                 this.jumpWay=false
                //  通过重定向,使得路由不记录这一层
                 location.replace(this.getSrc())
             }else {
                 this.src = this.getSrc()
             }

第二种方式,通过postmessage动态获取dom高度,然后在赋值给iframe

 window.addEventListener('message', this.handelMessage)

handelMessage(e){
                if(this.listen){
                    console.log(e)
                    const data = e.data
                    switch(data.cmd){
                        case 'buying':
                            console.log(`i am buying a fund ${ JSON.stringify(data.params) }`)
                            break
                        case 'height':
                            console.log(`i get height  ${ JSON.stringify(data.params) }`)
                            if(data.params.height==false){
                                this.height=document.body.clientHeight+'px'
                            }else{
                                this.height=data.params.height+"px"
                            }

                            break
                        case 'scollTop':
                            console.log(`i get scolltop  ${ JSON.stringify(data.params) }`)
                            // console.log( document.getElementById('content').scrollTop );
                            //  document.getElementById('content').scrollTop = 0
                            //  todo -如何实现把滚动调到最上面的位置第一位
                               document.documentElement.scrollTop=ata.params.scollTop
                            break
                        case 'load-completed':
                            console.log(`i am load-completed ${ JSON.stringify(data.params) }`)
                            this.isLoading = false
                            break
                        default:
                            console.log('do nothing ouside...')
                            break
                    }
                }
            }