1. 程式人生 > >vue ios11 IOS11.3系統滑動是父元素跟著滑動的解決方案 全機型滑動父元素跟著滾動

vue ios11 IOS11.3系統滑動是父元素跟著滑動的解決方案 全機型滑動父元素跟著滾動

IOS11.4系統如果彈框後父元素也跟著滾動的話,解決方案如下:

methods:{
      _preventDefault(e) { e.preventDefault(); },
      GetPageScroll(){
        var y;
        if (window.pageYOffset) {    // all except IE
          y = window.pageYOffset;
        } else if (document.documentElement && document.documentElement.scrollTop) {    // IE 6 Strict
          y = document.documentElement.scrollTop;
        } else if (document.body) {    // all other IE
          y = document.body.scrollTop;
        }
        return y
      },
      scrollRemoveLimit(){// 解除限制
        console.log(this.PageScroll)
        document.body.style.overflow = 'auto';
        document.body.style.position = 'static';
        document.body.style.zIndex = '0';
        window.removeEventListener('touchmove', this._preventDefault);
        window.scrollTo(0,this.PageScroll)
      },
      scrollLimit(){// 限制
        document.body.style.overflow = 'hidden';
        this.PageScroll = this.GetPageScroll()
        document.body.style.position = 'fixed';
        document.body.style.zIndex = '-100';
        window.addEventListener('touchmove', this._preventDefault);
      },
    },

vue中定義這幾個方法,如果有不懂的話可以留言,開啟彈框的時候呼叫this.scrollLimit();關閉彈框的時候呼叫:this.scrollRemoveLimit();

經測試,全機型都能解決彈框內部到頂後父元素跟隨滾動的問題,如果有機型不適配的話,留言一起學習一下怎麼解決