qv/src/layout/index.vue

<template>
      <el-container class="outer-container">
        <Header></Header>
        <el-container class="center-container">
          <Aside ></Aside>
          <el-container direction="vertical" >
            <Main></Main>
          <Footer></Footer>
        </el-container>
        </el-container>
      </el-container>
  </template>
  <script>
  import { Header, Main, Aside, Footer } from './'
  export default {
    name: 'Layout',
    components: {
      Header,
      Main,
      Aside,
      Footer
    }
  }
  </script>
  
  <style scoped>
  .outer-container{
    height: 100vh;
    flex-direction: column;
  }
  .center-container{
    overflow: hidden;
    height: calc(100vh - 90px);
  }
  </style>