キープアライブを使用

Vueの背景には、リストデータの詳細ページ、忠実な機能コードデータ変更ページのリストは、ほぼすべてのVUE前後にも、時にはコンポーネントの状態を保存するために必要なすべてのリフレッシュロジック・ピットたページの特定のAリストで、プロジェクトの管理を行うために、
必要があります。

詳細ページリストへ1.リストは、リフレッシュリターンページの一覧を、偶数ページ、およびそのフィルタ条件を変更することはできませんすることはできません

2.リストのデータページへの変更がある場合、リストの編集ページにデータがリストデータのリストがリフレッシュされた返しますが、ページ数、およびそのフィルタ条件を変更することはできません。

3.非詳細ページ、データのリストは、ページの編集リストページ、番号を入力するようにページを更新する必要がある、というようにすべてのフィルターをリセット

私はそれがリストを更新したいこのページでは、彼は彼を磨くことをしたくない、リフレッシュしなければならないとは何であるまとめる、彼は変化しませんでした

だから、シェーンは?はい、キープ・アライブ・コンポーネント、右、はい、それはです。

しかし、単純なキープアライブは、前後進意志は、それに従わせるために、それを変換する必要があるので、リフレッシュされていません。このプロセスは、私たちとのパラメータのメタをルーティングルーティングする必要があります。

1.リストキープアライブとifDoFreshフィールドが含まれているルーティングファイル内のメタパラメータのターゲットセット、

复制代码
{
パス: '*'、
名称: 'datalists'、
成分:解決=>必要とする([ '@ /ビュー/データリスト']、決意)、
メタ:{
キープアライブ:真、
ifDoFresh:偽
}
}、

コードをコピー

2.メイン・エントリ・ページは、キープアライブフィールドの判断に従ってキープアライブアセンブリかどうかmain.vue。

复制代码
<DIV CLASS = "メイン">
<キープアライブ>
<ルータ・ビューV-IF = "$ route.meta.keepAlive" />
</キープアライブ>
<ルータ・ビューV-IF = "!$ route.meta.keepAlive "/>
</ div>

コードをコピー
、真/偽のにifDoFreshルーティングパラメータセット場のニーズに応じて、beforeRouteEnter 3.判決にエントリーのページモード(詳細ページ、編集ページ、またはその他)内のページのターゲットリストを

有効ページでは(キープアライブを開く:ページがないトリガーが髪アクト搭載された第2の時間である真のとき)ページを更新するかどうかを決定するためにifDoFreshフィールドによる方法を。

コードコピー
beforeRouteEnter(次に、からの){
IF(from.name = '情報ページ' && from.name = 'Editページを'!)
{
To.meta.ifDoFresh = trueに;
}
;次に()
}
(活性化){
//キープアライブを開く:再入力真後に現在の検索条件の最新のデータを得ることができるので、検索語とページ以前は、状況がデータ収集インターフェースについて呼んでいるものに関係なく変更されることはありませんし、ページ数
ならば(。route.meta.ifDoFreshこの$){
// ifDoFreshをリセットし
、この$ = route.meta.ifDoFresh ;. falseに
  //リストの最初のパラメータのデータ取得方法やページにリセットするにはされているかどうかを検索条件
this.getDataを(真);
}他{
this.getData();
}
}
端!

おすすめ

転載: blog.51cto.com/13453562/2462765