使用flex布局实现滚动的效果-不用计算高度

<div class="meta-container flex flex-col">
  <div class="search-input p-[10px]">
    <search-input />
  </div>
  <div class="body flex-1 min-h-0">
      <div class="max-h-[100%] overflow-y-auto">
        <div v-for="item in 60" :key="item">
          {{item}}
        </div>
      </div>
  </div>
</div>

1、最外层盒子开启flex
2、下面的大盒子使用flex: 1
3、关键一步：大盒子还要设置min-height: 0;的属性
4、内部再创建一个盒子，设置height: 100%; overflow-y: auto;

原文链接【https://blog.csdn.net/weixin_47544559/article/details/131893702】