zoukankan      html  css  js  c++  java
  • mintui弹窗滚动穿透的问题

    使用场景:当弹窗出现的时候会发现底部的页面能滚动

    解决方法:在mt-popup标签中加上@touchmove.native.stop.prevent  这个方法是阻止默认根元素的默认事件,native是关键,这个表示根元素的意思,也就是body或者html

      <mt-popup
                class="confirm_xcxlist"
                v-model="xcxlist"
                popup-transition="popup-fade"
                hight="50%"
                @touchmove.native.stop.prevent
            >

    还有一种场景是弹窗也需要滚动,这个时候就不能用这个方法了,我们可以监听xcxlist值的变化来改变body节点touchMove事件

     //阻止滚动穿透
            xcxlist: function (val) {
                if(val) {
                    document.getElementsByTagName('body')[0].addEventListener('touchmove', this.handler, { passive: false });
                } else {
                    document.getElementsByTagName('body')[0].removeEventListener('touchmove', this.handler, { passive: false });
                }
            }
    

      

  • 相关阅读:
    根据坐标点画图形
    js 解析geojson格式
    devexpress 安装
    DataTable 获取列名
    ADO.NET 注册
    css:outline
    javascript函数sort
    引用类型-2015/10/06
    2015-11-02-js
    jquery
  • 原文地址:https://www.cnblogs.com/xiaohuohuai/p/15410812.html
Copyright © 2011-2022 走看看