el-dialog 弹窗弹出，导致两个滚动条，影响用户体验_el-popup-parent--hidden

el-dialog 弹窗弹出，导致页面有两个滚动条，el-dialog有一个，body也有一个，弹窗弹出需要把外面的滚动条隐藏掉，这样不会导致弹窗出来底层的页面还可以上下滚动，那怎么解决

网上有很多种方法，但是还是解决不了我的需求，重要的是在 body,html添加  overflow: hidden;和#app  添加 height: 100%; overflow: auto;

1、静态写法

body,html{
 
  width:100%;
 
  height:100%;
 
  margin:0;
 
  padding:0;
 
  overflow: hidden;
 
}
 
#app {
 
  height: 100%;
 
  overflow: auto;
 
}

2、js动态写法

// 类样式
.el-popup-parent--hidden {
    overflow: hidden;
}
 
// 打开弹窗的时候，添加类名
document.querySelector('body').classList.add('el-popup-parent--hidden')
 
// 关闭弹窗的时候，移除类名
document.querySelector('body').classList.remove('el-popup-parent--hidden')
 

您的点赞、关注、评论加收藏，就是我每天更新笔记的动力，谢谢！希望对您有所帮助~