Vueはページキャッシュ機能を実装する

「vue」からVueをインポートします。
「vue-router」から Router をインポートします。

// 現在の場所への冗長なナビゲーションを避ける const originalPush = Router.prototype.push
Router.prototype.push = 関数push(location) {
   元のPush.call(this, location).catch(err => err) を返します
}

Vue.use(ルーター);
デフォルトの新しいルーターをエクスポートします({
  ベース: ''、
  ルート: [{
      パス： "/"、
      名前: "インデックス",
      コンポーネント: () => import("@/layout"),
      リダイレクト: '/login',
      子供たち： [
        {
          パス: 'dutySheet',
          名前: 'dutySheet',
          コンポーネント: () => import("@/pages/Dashboard/DutySheet")
        },
        {
          パス: 'searchWord',
          名前: '検索ワード',
          コンポーネント: () => import("@/pages/dailyReportManage/searchWord/index"),
          メタ: {
            keepAlive: true // ページをキャッシュする必要があります}
        },
        // マッチングメンテナンス{
          パス: "troopAction",
          名前: "troopAction",
          コンポーネント: () => import("@/pages/Dashboard/TroopAction"),
          メタ: {
            keepAlive: false // キャッシュは不要}
     },
      ]
    },
  ]
});

<キープアライブ>
    <ルータービュー v-if="$route.meta.keepAlive"></ルータービュー>
</キープアライブ>
<ルータービュー v-if="!$route.meta.keepAlive"></ルータービュー>

// 戻り値 backKBnt(){
        this.$router.back()
      },

beforeRouteLeave(to, from, next) {
      if (to.name == 'exhibitionWord' || to.name == 'exhibitionWeekWord') { // キャッシュされるルート名
          from.meta.keepAlive = true
          次（）
        }それ以外{
          from.meta.keepAlive = false
          次（）
      }
    },