鍍金池/ 問答/網(wǎng)絡(luò)安全  HTML/ MINT-UI中如何讓遮罩層彈出后,阻止頁面滾動?

MINT-UI中如何讓遮罩層彈出后,阻止頁面滾動?

在MINT-UI中,類似Popup等組件,當(dāng)遮罩層彈出后
需要阻止頁面BODY的滾動,如何設(shè)定呢?沒有找到相應(yīng)的API

想通過監(jiān)聽遮罩層彈出關(guān)閉事件來實(shí)現(xiàn),遮罩層關(guān)閉的事件在哪里可以監(jiān)聽呢?

查詢源碼后,發(fā)現(xiàn)類似lockScroll的選項(xiàng),但是沒有找到暴露的接口,這個(gè)設(shè)置項(xiàng)該如何設(shè)定才能生效?

回答
編輯回答
骨殘心

<mt-popup position="right"

       v-model="popupVisible"
       pop-transition="popup-fade">

<div class="overlayer" @touchmove.prevent >

....

</div>
</mt-popup>

/遮罩層/
.overlayer{

position:fixed;
left:0;
top:0;
width:100%;
height:100%;
z-index:10;

}

這樣可以組織蒙層彈出時(shí),還能滑動body的問題,但是鼠標(biāo)滑輪依然可以。
2018年1月20日 13:36
編輯回答
孤慣

clipboard.png

2017年9月20日 10:00
編輯回答
擱淺

哥們找到方法了嗎?我也遇到這個(gè)問題了

2017年7月28日 00:07
編輯回答
葬愛

監(jiān)聽v-model綁定的popupVisible,為true的時(shí)候,獲取當(dāng)前頁面的外層div,設(shè)置其樣式屬性,height:100%;overflow:hidden;popupVisible為false時(shí)候,設(shè)置外層div height:'',overflow:‘’不理解可以溝通,個(gè)人有篇文章里面也提到了這個(gè)問題

2017年3月19日 22:07