element ui el-scrollbar组件双滚动条解决方案

背景：el-scrollbar 自定义滚动条样式

bug：用户使用过程中出现双滚动条样式，如下图：

分析原因：经过排查，用户有多个屏幕，屏幕之间分辨率不一样，屏幕1 100%，屏幕2 150%缩放比，

复现步骤：由屏幕1拖拽到屏幕2窗口 会出现样式不一致情况

最终结果：分辨率不一致，浏览器窗口会等比例缩放应用

根据源码得知，

1. el-scrollbar会获取滚动条的宽度
2. 并且设置 margin-left,margin-bottom来隐藏原生滚动条，
3. 由于缩放比不一样，获取到滚动条宽度不一样，页面并没有重新渲染，
4. 那么就会导致margin-right，margin-bottom错误的情况出现，
5. 既然这样，我们把滚动条的宽度写死，那么就可以得到一个固定的值

解决方案代码如下

// #region 解决el-scrollbar出现双滚动条bug
// 垂直方向
.el-scrollbar__wrap::-webkit-scrollbar:vertical {
    width: 6px;
    background-color: transparent;
}
// 水平方向
.el-scrollbar__wrap::-webkit-scrollbar:horizontal {
    height: 6px;
    background-color: transparent;
}
// #endregion