Vue keep-aliveによるページキャッシュ

トップページ→ページ1、さらにページ1→トップページの場合、トップページが離れる時と同じであることを保証します.(特定のコンポーネントをキャッシュできますが、プロジェクトは関連していませんので、説明は保留します)
App.vue

<keep-alive>
  <router-view v-if="$route.meta.keepAlive"></router-view>
</keep-alive>
<router-view v-if="!$route.meta.keepAlive"></router-view>

routerでkeepAliveを構成するには、tureとしてキャッシュする必要があり、falseとしては必要ありません.

 routes: [{
   path: '/',
   name: 'RootPath',
   meta: {
     keepAlive: true
   },
   component: MainSec
 }, {
   path: '*****',
   name: 'detail',
   meta: {
     keepAlive: false
   },
   component: DetailSec
 }, {
   path: '/404/',
   name: '404',
   component: page404
 }]

activatedとdeactivatedを使用してパラメータを変更できます

activated:keep-aliveコンポーネントがアクティブになったときに呼び出されます.

deactivated:keep-aliveコンポーネントが無効になったときに呼び出されます.

vue keep-aliveドキュメント