是否有现成的开源组件可以直接使用呢？

同上 flex 布局就行

<div class="box">
    <div class="header">
    </div>
    <div class="content">
        <div class="left"></div>
        <div class="panel"></div>
        <div class="right"></div>
    </div>
</div>

<style>
    .box{height: 100vh;display: flex;flex-direction: column;}
    .header{height: 40px;}
    .content{display: flex;overflow:hidden;flex: auto;}
    .left,.right{flex: 0 0 200px;}
    .panel{flex: auto;}
</style>

<style>
    *{padding:0;margin:0;}
    div{
        background: rgba(240,230,12,.1);
        border: 1px solid #f00;
    }
</style>

本文参与了SegmentFault 思否面试闯关挑战赛，欢迎正在阅读的你也加入。