在使用electron开发过程中整个页面如果超出页面高度就会出现滚动影响体验,页面内部分元素超出高度可以使用部分区域的滚动,比较接近原生应用体验。在父元素使用flex布局的情况下,子元素会超出父元素的高度,解决方法是给子元素加上min-h-0
,限制最小高度为0,然后在想要的滚动元素(min-h-0
元素或其父元素)上加上overflow-auto
或者overflow-scroll
。比如:
<div className="flex flex-col">
<div></div>
<div className="min-h-0 overflow-auto">
<table>
// ...
</table>
</div>
</div>