How to place Ant Design Table in parent container bounds under React?

Question

I develop a SPA application and I wish place table in parent element bounds but I can't set explicit height. I can set scroll.y of table body but then result total height is large by header height. I can't get header height to calculate total needed height. How I may place table into parent bounds?

<div style={{ width: '100vw', height: '100vh'}}>
<Table scroll={{ y: '100%' }} style={{ width: '100%', height: '100%' }}  pagination={false} columns={columns} dataSource={data} />

Answer 1

似乎它更像是 Ant 中的 CSS 问题，然后是错误。这是浏览器限制。
尝试使用与vh混合的单位calc：

例子：

scroll={{ y: 'calc(100vh - 4em)' }}

相关Github讨论（需要翻译）

Answer 2

不要设置scroll={{ y: '100%' }}，而是设置一个数字。因为滚动 y 只接受数字，而滚动 x 接受数字或布尔值。