element [bug report] Table add the last column fixed. When there is a scroll bar, switch the table width. The box shadow style on the left of the last column disappears

klsxnrf1  于 6个月前  发布在  其他
关注(0)|答案(2)|浏览(48)

Element UI version

2.13.0

OS/Browsers version

macos/chrome(current)

Vue version

2.6.11

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,与滚动条实际位置不匹配

axkjgtzd

axkjgtzd1#

Translation of this issue:

Element UI version

2.13.0

OS/Browsers version

macos/chrome(current)

Vue version

2.6.11

https://codepen.io/hollydysania/pen/RwPmNQV

Steps to reproduce

  1. Move the bottom scroll bar of the table to the far right
  2. Click the menu on the left side of the template to expand the fold up button (at this time, the scroll bar of 100% of the width of the table's parent box disappears)
  3. Click the menu on the left side of the template again to expand the fold up button (the scroll bar appears when the width of the table's parent box becomes smaller)

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

xxhby3vn

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.

相关问题