Vueルータはキープアライブを使用して特定のコンポーネントをキャッシュしますか？

Question

私は最近vueの作業を開始しました。単純なページを作成しましたが、一度ロードされたコンポーネントがキャッシュされていないことに気付きました。例えば、下のリンク（これは私が取り組んでいるものです）youtube videosロードに時間がかかります。他のリンクをクリックして動画に戻ってきた場合は、再び読み込まれます。

コンポーネントをキャッシュすることは可能ですか？好ましくは1

によって、それらの代わりに、1のすべてがここに私のVUEです：

import VueRouter from 'vue-router'; 
import Create from '../components/homepage/create.vue'; 
import How from '../components/homepage/how.vue'; 
import About from '../components/homepage/about.vue'; 
import Youtube from '../components/homepage/youtube.vue'; 
import Navigation from '../components/homeNavigation.vue'; 
import Login from '../components/auth/login.vue'; 
import Register from '../components/auth/register.vue'; 


const routes = [ 
    { path: '/create', component: Create }, 
    { path: '/how', component: How }, 
    { path: '/about', component: About}, 
    { name: 'youtube', path: '/youtube', component: Youtube}, 
    { path: '/login', component: Login}, 
    { path: '/register', component: Register}, 
]; 

Vue.use(VueRouter); 
Vue.component('navigation', Navigation); 

const router = new VueRouter({ 
    routes, 
}); 

new Vue({ 
    el: '#app', 
    router, 
    updated: function() { 
     Pace.restart() 
    }, 
    mounted: function() { 
     Pace.restart() 
    } 
}); 

ビュー：

<div id="app"> 
     <navigation></navigation> 
      <transition appear name="slide-fade" mode="in-out"> 
       <keep-alive include='youtube'> 
        <router-view></router-view> 
       </keep-alive> 
      </transition> 
</div> 

マイアプリ：

http://b2750916.ngrok.io/#/youtube

Answer 1

はここにこの答えをチェックしてください： https://forum.vuejs.org/t/keep-alive-specific-component/2372/2

以降v2.1以降どのコンポーネントをキャッシュするかを制御するための正規表現として「include」および「exclude」属性を使用できます。これらの属性はまた、V-bind'edことができます。 https://vuejs.org/v2/api/#keep-alive

もう一つの方法は、あなたがキャッシュしたままにしたくないコンポーネントにdeactivatedフックを使用することです。フックでは、this.$destroy();を呼び出して、使用していないときにキャッシュ下のコンポーネントを削除します。

また、おそらくこれが役立つでしょうか？ https://github.com/LinusBorg/portal-vue

portal-vueが機能するかどうかはわかりませんが、私の考えは、ビデオを独立してレンダリングして（ルートコンポーネントに配置された「ポータル」内に）ビデオを配置し、ポータルターゲット "を選択します。