vue-elementUI后台管理容器的写法实例--2

<!-- 这是后台管理容器 -->
  <el-container style="height: 100%">
    <el-aside width="auto">
      <common-aside></common-aside>
    </el-aside>
    <el-container>
      <el-header>
        <common-header></common-header>
      </el-header>
      <!--加入CommonTab-->
      <common-tab></common-tab>
      <el-main>
        <router-view />
      </el-main>
    </el-container>
  </el-container>

js中导入组件

import CommonAside from "../components/CommonAside";
import CommonTab from "../components/CommonTab";
import CommonHeader from "../components/CommonHeader";
export default {
  components: {
    CommonAside,
    CommonTab,
    CommonHeader,
  },
};