鍍金池/ 問答/HTML/ vue keep-alive 返回到原來的頁面 仍然調(diào)用了created和mou

vue keep-alive 返回到原來的頁面 仍然調(diào)用了created和mounted方法

實現(xiàn)從B頁面跳轉(zhuǎn)到A頁面,A頁面需要緩存

我的代碼:

A頁面路由配置:
{   path: 'tea_audit',
    meta: {
        keepAlive: true,

    },
    component: _import('teacher/tea_audit')
}
B頁面路由配置:
{
    path: 'infoDetail/:id/:type',
    meta: {
        keepAlive: true,
    },
    hidden: true,
    component: _import('teacher/tea_infoDetail')
}
router-view:
<template>
  <section class="app-main">
    <transition name="fade" mode="out-in">
      <keep-alive v-if="$route.meta.keepAlive">
        <router-view :key="key"></router-view>
      </keep-alive>
      <router-view v-if="!$route.meta.keepAlive" :key="key">
      </router-view>
    </transition>
  </section>
</template>

但是從B頁面使用router-link返回A頁面時,A頁面執(zhí)行了created和mounted方法
 <router-link :to="{ name: backPageName, params: {activeName: backTabName}}">返回</router-link>

為什么呀,A到B的時候確實是執(zhí)行created-> mounted-> activated,退出時觸發(fā)deactivated的,為什么回來A執(zhí)行了created-> mounted-> activated,求解

回答
編輯回答
清夢

vue是單頁面,路由只是控制元素的顯隱,所以不存在緩存。
meta只是一個可以讀取的對象而已,不是設(shè)置http鏈接的。
路由切換舊的路由組件必定會destroy。
如果想只執(zhí)行一次這個鉤子可以判斷這個頁面時候進來過,如果已經(jīng)訪問過就不執(zhí)行。

2018年2月27日 11:37
編輯回答
怣人

按道理說,組件設(shè)置了keep-alive后,再次進入的時候,就不會執(zhí)行mounted鉤子函數(shù)了,我也遇到了相同的問題,后來使用beforeRouteEnter路由守衛(wèi),來判斷進入的路由路徑做不同操作了

2017年10月31日 13:32