キープアライブを使用して動的に1つのルートコンポーネントをキャッシュする

Question

私のルートコンポーネントの一部に条件付きでキープアライブを設定し、キャッシュされたルートをクリアして新しいキャッシュされたルートを設定できるようにしようとしています。 以下のコードは動作しますが、キャッシュされたコンポーネントをクリアすることはできません。

私は

 { 
      name: 'Route1', 
      path: '/route1', 
      component: lazyLoading('route1', true), 
      meta: { 
       auth: true, 
       cacheRoute: 'Route1', 
      }, 
     }, 
     { 
      name: 'Route2', 
      path: '/route2', 
      component: lazyLoading('route1', true), 
      meta: { 
       auth: true, 
       cacheRoute: 'Route2', 
      }, 
     }, 

をキャッシュしたいし、私は私のルータ上beforeEachメソッドを使用してルート上のメタ小道具を持っています。

router.beforeEach((to, from, next) => { 
    if (to.meta.cacheRoute && store.getters.cachedRouteObject.cached !== 
    to.meta.cacheRoute) 
     store.dispatch('cacheRoute', { 
      cached: to.meta.cacheRoute, 
      uncached: from.meta.cacheRoute, 
     }).then(() => { 
      next(); 
     }); 
    next(); 
}); 

そして、このようなvuexのcachedRouteObject使用：ポイントは、私はルートからのルートに切り替えると時間をかけて滞在をキャッシュし、キャッシュされる必要があり、すべてのコンポーネントが私はで終わるということです

<keep-alive :include="cachedRouteObject.cached" 
    :exclude="cachedRouteObject.uncached"> 
     <router-view></main-router-view> 
    </keep-alive> 

を多くのキャッシュされたコンポーネント私は期待していたように、除外属性は機能しません。 1つのルートコンポーネントだけを常にキャッシュする方法に関するアイデア。

Answer 1

keep-aliveにはルート名ではなくコンポーネント名を渡す必要があります。 nameオプションが利用できない場合

試合は最初 そのローカル登録名（親のコンポーネント オプションでキー）、その後、コンポーネント自身の名オプションにチェックされています。匿名のコンポーネント は照合できません。コンポーネント自身の名前を渡す

https://vuejs.org/v2/api/#keep-alive