Table
要想实现内容区域高度撑满并滚动的效果,需要给 scroll 属性的 y 设置一个「固定值」,不能比较「智能」地计算。
scroll
y
常见的解决方案是用 JS 动态计算出容器实际需要的高度,但这样会令渲染性能下降,可以考虑用 CSS 去解决,把计算交给浏览器:
.ZoraDataTable { &-table { height: 100%; :global { .ant-spin-nested-loading, .ant-spin-container, .ant-table-container { height: 100%; } .ant-spin-container, .ant-table-container, .ant-table-container > .ant-table-body { display: flex; flex-direction: column; } .ant-table-fixed-header, .ant-table-container > .ant-table-body { flex-grow: 1; } .ant-table-pagination, .ant-table-container > .ant-table-header{ flex-shrink: 0; } .ant-table-pagination { margin: 0; padding: 16px 0; } .ant-table-container > .ant-table-body { max-height: none !important; height: 0; } } } }
创作不易,若给你提供了价值,还请不吝为欧雷充电
左为微信,右为支付宝;充电累计 ¥88 以上可在付款时备注或邮件告知昵称和需要被链接的网址,会列在「赞助」页。其他方式与具体规则请见「资助」。