vue中動態組件的使用及相關問題

<component v-bind:is="currentTabComponent"></component>

 動態組件主要是運用 is 屬性 達到切換組件的效果。

 如何使動態組件保持狀態--- keep-alive （有時候，我們希望能保持被動態加載組件的狀態，已避免反復重復渲染導致的性能問題）

 

<keep-alive>
      <component :is="currentTabComponent"></component>
</keep-alive>

但是，我們在使用keep-alive來保持組件狀態的同時， 也帶來了另外一個問題， 就是第二進入頁面之后， 組件的鈎子函數created 和 mounted 不會再次被觸發（除了activated鈎子外， 都不會觸發）

解決辦法：

        1.  在對應組件中， 加activated鈎子函數再次請求數據接口。

        2.  或者， 使用exclude來忽略對應緩存的組件   (只適用於單個組件)

<keep-alive exclude="posts">
      <component :is="currentTabComponent"></component>
</keep-alive>