vueにおけるkeep-aliveの使用

1732 ワード

vueにおけるkeep-aliveの使用
問題の説明
ビジネス開発では、ルーティングがジャンプしますが、データを保持する必要があるシーンが返されます.vueではkeep-aliveが処理されています
ソリューション
domに戻って再リフレッシュさせず、vue-viewの外側のパンの層にあり、keep-aliveが導入されるとページが最初に入り、フックのトリガ順序created->mounted->activated、終了するとdeactivatedがトリガーされます.再び入る(前進または後退)とactivatedのみがトリガーされます.イベントのマウント方法などは、mountedに一度だけ実行されます.コンポーネントが入るたびに実行する方法はactivatedに置かれます.keep-aliveをパラメータで構成するかどうかを包むことができます.
<keep-alive>
    <router-view v-if="$route.meta.keepAlive" style="min-height:100%"></router-view>
</keep-alive>
<router-view v-if="!$route.meta.keepAlive" style="min-height:100%"></router-view>
//               meta: {keepAlive: true},             ;
//              meta: {keepAlive: false},             ;