cocoroboBlockly/src/App.vue

<template>
  <div id="app">
    <div class="head">
      <div class="logo">
        <span style="font-size:28px;font-family:'GT Walsheim Pro Trial Bold';font-weight:bold;color:#fff">CocoBlockly</span>
      </div>
    </div>

    <div style="height: calc(100% - 67.5px)">
      <!-- main 内容 -->
      <keep-alive v-if="$route.meta.keepAlive">
        <!-- 这里是会被缓存的视图组件 -->
        <router-view
          v-if="$route.meta.keepAlive"
        />
      </keep-alive>
      <!-- 这里是不被缓存的视图组件 -->
      <router-view
        v-if="!$route.meta.keepAlive"
      />
    </div>
  </div>
</template>

<script>
export default {
  name: "App",
};
</script>

<style>
* {
  margin: 0;
  padding: 0;
}
body {
  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
    "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
}
#app {
  height: 100%;
  width: 100%;
  /* background: #e6eaf0; */
  /* min-width: 1380px; */
  min-width: 1000px;
}
.head {
  height: 67.5px;
  width: 100%;
  background-color: #2c4fcd;
  display: flex;
  align-items: center;
  min-width: 1000px;
}
.logo {
  margin-left: 20px;
}
</style>