vue dialog嵌套,遮罩層遮蓋住對話框的解決方法


在vue的dialog中嵌套dialog,彈出里層的dialog時,發現被dialog的遮罩層擋住了,如下所示:

 官方文檔中的嵌套dialog例子指出了原因:

對於確實需要嵌套 Dialog 的場景,提供了append-to-body屬性。將內層 Dialog 的該屬性設置為 true,它就會插入至 body 元素上,從而保證內外層 Dialog 和遮罩層級關系的正確。

將內層嵌套的dialog封裝成了外層dialog的子組件,內層dialog的代碼如下:

 如上面所示,加入了 append-to-body 屬性。

頁面效果如下:

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM