解決小程序彈出層滾動穿透的問題

今天在做小程序的時候，遇到了一個棘手的問題，那就是彈出層的滾動穿透，即彈出層滾動，那么被彈出層覆蓋的下面的內容區域也會進行滾動,這一點就很麻煩了。彈出層我是用的view標簽然后使用的position:fixed進行的定位；說一下我的解決思路:

一：當彈出層里面無滾動的時候：

可以在遮罩的view標簽上定義一個防止事件冒泡的方法：

catchtouchmove="preventD"；
 
 
 preventD() {
    return
  }

 

　　  二：當彈出層有滾動的時候：

在小程序里面一般滾動組件使用的是scroll-view，這個時候我們只需要在打開遮罩的時候給最外層的(不想讓滾動的)view標簽加上一個 noscroll 類名，關閉彈出層的時候吧 class移除掉  就可以了，

.noscroll {
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: fixed;
  z-index: 0;
}

 

　　親測有效

原文：https://www.cnblogs.com/mmykdbc/p/9035418.html