Element UI version
2.15.13
OS/Browsers version
win11 / Chrome 114.0.5735.110
Vue version
2.7.14
Reproduction Link
https://codepen.io/codog-in-github/pen/XWymjZv
Steps to reproduce
无需操作 直接可重现
What is Expected?
合计行位于底部
What is actually happening?
合计行超出容器盒子 调整浏览器大小后才位于底部
4条答案
按热度按时间8qgya5xd1#
去掉 height="100%" 效果会好些
原因就是计算 bodyHeight 时候 减去的 footerHeight值是0,导致表格高度不对了。
footerWrapper.offsetHeight 开始是0,后来是会有值的,但是这时候的 bodyHeight 已经计算完毕了。
参考 packages/table/src/table-layout.js updateElsHeight()
9nvpjoqh2#
去掉 height="100%" 效果会好些
原因就是计算 bodyHeight 时候 减去的 footerHeight值是0,导致表格高度不对了。 footerWrapper.offsetHeight 开始是0,后来是会有值的,但是这时候的 bodyHeight 已经计算完毕了。
参考 packages/table/src/table-layout.js updateElsHeight()
去掉 height="100%" 的话 表格会把父元素撑开、导致表格的header和footer不固定在上下两侧
f0brbegy3#
同样遇到了这个问题
1l5u6lss4#
`
setTimeout(() => {
this.loading = false
this.data = Array(100).fill({
name: '11',
num: 111
})
`
异步数据加载后,通过以上形式手动调用Table组件的doLayout方法重新计算布局即可。