前段時間，在做移動端項目的時候，遇到滑動穿透事件。可以理解為冒泡事件？大概就是，當你滑動遮罩層上面的內容的時候，遮罩層下面的內容也會跟着一起動，這樣用戶體驗就很不好了。后面百度了一堆方法，都是各種操作dom元素。自己這個本身是一個vue項目，還要操作dom？這就很不爽了吧。
解決思路 主要兩步就完美解決了整個問題
1 使用vue的阻止默認事件 @touchmove.prevent 給遮罩層一個阻止默認事件
2 用一個div把你想不能讓他滑動的內容包裹起來，div的樣式設置為
.hidden{
overflow: hidden;
position:fixed;
height: 100%;
width: 100%;
}
3 當你彈出遮罩層的同時把這個div的樣式也添加上去。移除遮罩層的同時，也移除這個類
4 重點是div的樣式設置為固定定位這樣就解決了下面的內容跟着一起滑動的問題了。