最近在智能体大火，我在做一个与智能体对话的会话框。
大致的结构是三部分：头部区域、会话区域和底部区域。头部区域保持不变，会话区域根据会话列表渲染，超过高度会产生滚动条，底部区域是输入框。
问题1：之前的会话区域高度写死了height，导致在笔记本的小屏幕上会显示不全，会在整个视口区域产生一个大的滚动条。现在要求实现这个对话框的自适应屏幕效果。
解决方案：将会话区域的高度设置为calc（100vh - 240px），实现了中间会话区域随着视口高度的变化而变化，从而实现整个部分都会显示在屏幕中间。
问题2:之后底部区域要求做一个上传文件的功能，这就导致了底部区域的高度是会变化的，需要监听底部区域的高度。
解决方案：维护一个状态useState,动态改变中间会话区域的高度 calc(100vh - ${footerHeight})。
最近在开发的过程中，经常有一种之前背诵的八股在大脑里呼应上了的感觉，自己在秋招的时候却没有多少感触，很奇妙，敦促自己要继续加强知识储备～
周末快乐～
2025.08.21 【更新】
中间的会话区域使用flex：1，效果很好，这样就不用计算calc要减去的高度了。
