1. init flex处理

src/views/pages/main.vue

@@ -3,7 +3,7 @@
         <div class="flex-none">
         <div class="flex-none">
             <CommonHeader></CommonHeader>
             <CommonHeader></CommonHeader>
         </div>
         </div>
-        <div class="root-contaniner d-flex flex-fill">
+        <div class="root-contaniner d-flex">
             <el-scrollbar class="container-scrollbar-left">
             <el-scrollbar class="container-scrollbar-left">
                 <AsidePanels class="flex-none"></AsidePanels>
                 <AsidePanels class="flex-none"></AsidePanels>
             </el-scrollbar>
             </el-scrollbar>
@@ -40,13 +40,14 @@
         min-width: 1200px;
         min-width: 1200px;
 
 
         .root-contaniner {
         .root-contaniner {
-            height: 100%;
+            height: calc(100vh - 64px);
         }
         }
 
 
         .main-container {
         .main-container {
             height: 100%;
             height: 100%;
             background-color: #f5f6fa;
             background-color: #f5f6fa;
             padding: 24px;
             padding: 24px;
+            min-height: 540px;
 
 
             .router-page {
             .router-page {
                 height: 100%;
                 height: 100%;
@@ -73,8 +74,6 @@
             height: 100%;
             height: 100%;
 
 
             .el-scrollbar__view {
             .el-scrollbar__view {
-                //     display: flex;
-                //     flex-direction: column;
                 height: 100%;
                 height: 100%;
             }
             }
         }
         }