關於vue單頁面應用總是先出現主頁一閃而過的現象

　　問題描述：每次強制刷新登陸頁面時，總是會出現主頁一閃而過的現象，如果主頁上有請求，還會請求后台數據。感覺不太正常，所以想到研究下為什么，然后去掉這個主頁一閃而過的現象

1、先看下我之前的app的router-view設置

<template>
  <el-container :class="['app uf-col']">
    <template v-if="$route.meta.fullScreen">
      <router-view></router-view>
    </template>
    <template v-else-if="$route.meta.homePages">
      <Nav></Nav>
      <router-view></router-view>
    </template>
    <template>
      <WHeader></WHeader>
      <el-container>
        <WMenu></WMenu>
        <router-view></router-view>
      </el-container>
    </template>
  </el-container>
</template>

　　也就是說：當meta信息fullScreen為true時，我是讓全屏展示的；homePages為true時，就會展示導航欄+router-view內容；然后else的時候呢，就展示登錄之后的內容：頭部+菜單+內容。

　　問題其實就出現在這個else里面。

　　我的根路由是設置了meta的homePages的，所以根路由進來是第二塊展示；然后從根路由跳轉登錄等等都沒有問題。但是出現問題的是：比如我localhost/#/login，這樣刷新網頁的時候，你就會發現主頁一閃而過的現象。

　　我在路由導航里一步步調試發現，當你這么刷新的時候，to：是"/login"，from：是"/"，也就是說路由導航認定你是從根路由去login路由，至於一閃而過的現場，難道是from路由就默認渲染了一次？

　　但是我的根路由是設置了路由元信息homePages的，也不該走到else里面去啊？

　　調試發現這種直接刷新localhost/#/login的情況，from路由雖然是"/"，但是它卻沒有meta信息，meta屬性是個空對象{}，所以它就走入了else的展示，默認渲染了頁面，然后再通過路由導航守衛攔截進入的登錄頁面。這應該就是問題的根源：那么我只需要讓那個根路由不走進else就行了。所以我再加個條件：

<template>
  <el-container :class="['app uf-col']">
    <template v-if="$route.meta.fullScreen">
      <router-view></router-view>
    </template>
    <template v-else-if="$route.meta.homePages">
      <Nav></Nav>
      <router-view></router-view>
    </template>
    <template v-else-if="$route.fullPath != '/'">
      <WHeader></WHeader>
      <el-container>
        <WMenu></WMenu>
        <router-view></router-view>
      </el-container>
    </template>
  </el-container>
</template>

　　這樣問題就解決了。當然不知道是不是最好的方式，有更好的方式，希望大家不吝賜教。