Element UI version
2.13.0
OS/Browsers version
macos/chrome(current)
Vue version
2.6.11
Reproduction Link
https://codepen.io/hollydysania/pen/RwPmNQV
Steps to reproduce
1、将table底部滚动条移动到最右侧
2、点击模板左侧菜单展开折起按钮(此时表格父盒子宽度100%滚动条消失)
3、再次点击模板左侧菜单展开折起按钮(此时表格父盒子宽度变小滚动条出现)
但最后fixed一列的box-shadow样式消失
What is Expected?
按照以上操作步骤 再次出现滚动条时fixed一列的box-shadow样式不消失
其实再次出现滚动条时滚动条在左侧 但class却是is-scrolling-right
What is actually happening?
当table存在底部滚动条时将滚动条拉到最右侧 再切换table父盒子宽度滚动条消失(左侧有菜单可展开收起的场景,codepen中用按钮模拟,点击按钮即可)
再点击模拟按钮还原出现滚动条的宽度时 最后一列fixed的box-shadow样式消失
原因:出现滚动条,滚动条初始化是左侧,而table的样式class保持了el-table__body-wrapper is-scrolling-right,与滚动条实际位置不匹配
2条答案
按热度按时间axkjgtzd1#
Translation of this issue:
Element UI version
2.13.0
OS/Browsers version
macos/chrome(current)
Vue version
2.6.11
Reproduction Link
https://codepen.io/hollydysania/pen/RwPmNQV
Steps to reproduce
But in the end, the box shadow style of the fixed column disappears
What is Expected?
The box shadow style of the fixed column does not disappear when the scroll bar appears again according to the above steps
In fact, when the scroll bar appears again, the scroll bar is on the left, but class is is scrolling right
What is actually happening?
When there is a bottom scroll bar in the table, pull the scroll bar to the far right and switch the width of the table's parent box. The scroll bar disappears (there is a menu on the left that can be expanded and folded up, use the button in codepen to simulate, and click the button)
Click the simulation button again to restore the width of the scroll bar. The box shadow style of the last fixed column disappears
Reason: the scroll bar appears. The initialization of the scroll bar is on the left, while the style class of table keeps the El table body wrapper is scrolling right, which does not match the actual position of the scroll bar
xxhby3vn2#
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.