记 el-tabs el-tab-pane 中嵌套 router-view出现的问题

在 el-tabs el-tab-pane 中嵌套router-view 会出现内部的子路由 所有的生命周期钩子 调用两到三次；不得不说，这玩意是真的坑。这边将router-view从el-tab-pane中拿出来即可 ；

 

 <el-tabs v-model="$store.state.contentTabsActiveName"
        @tab-click="tabSelectedHandle"
        @tab-remove="tabRemoveHandle">
        <el-tab-pane
          v-for="item in $store.state.contentTabs"
          :key="item.name"
          :name="item.name"
          :label="item.title"
          :closable="item.name !== 'Dashboard'">
          <template v-if="item.name === 'Dashboard'" #label>
            <img width="20" height='20' src="../../icons/svg/home.svg" alt="">
          </template>
         
        </el-tab-pane>
      </el-tabs>
    <div class="router">
        <router-view v-slot="{ Component }">
            <component :is="Component" />
      </router-view>
    </div>

转自：https://www.it1352.com/696885.html