今天在写PC商城首页，发现了一个头疼的问题，需求是点击商城首页消息列表弹出一个弹框，弹框用的是element
e-dialog组件，当弹框出现的时候，整个页面会向右偏移，难道是页面或者消息组件css的问题？经过排查没有发现什么问题~ 我又琢磨一番又想到了是e-dialog自身是否插入至body元素上 的问题？然后我加上了append-to-body="true"，ctrl+s之后发现还不行... 奇怪了? 折腾好一会儿发现 弹框出现的时候body上会出现padding-right:17px，弹框消失，padding-right:17px也隐藏了。
一、产生原因
e-dialog多次弹窗导致页面左移，屏幕晃动的bug，原因有两个：
1、e-dialog模态框显示时，框架默认给body添加一个padding-right为17px的样式
2、modal-open 的overflow：hidden导致原本有的滚动条消失，窗口重新调整大小，造成屏幕晃动。
二、解决办法
- 在
index.css或者app.vue主入口加上：
body { padding-right: 0px !important; }
.modal-open { overflow-y: scroll; padding-right: 0 !important；}
