6.ヴュー - ライフサイクル

まず、公式VUEのライフサイクルフロー図

二、VUEのライフサイクルの紹介

  1. beforeCreateが実行されたとき:データとELを全く初期値は不定ではありません

  2. 作成行うとき:ヴューが設定されているデータオブジェクトを見たデータの例を、その値app.messageを得ることができたが、素子ELのVueのDOMインスタンスのルートがまだ初期化、AJAX複数のバックエンドからデータを取得します

  3. beforeMountが実行されたとき:データは初期化され、EL、{{メッセージ}}このような現象はこの時点では見ることができず、データELにレンダリングし、ELが「仮想」ノード要素

  4. ときに実行をマウント:この時点で、エルは、レンダリングされた、およびインスタンス上に取り付けられ、文書は、結合事象を完了したレンダリング!
  5. 概要:beforecreated:;:、初期化データのデータの完了をエルなし; beforeMount:エルとデータが初期化されませんでした作成したエルが完了し、データの初期化、マウント:完全に取り付けられています。(注:beforeMount仮想DOM(仮想ドム)技術のアプリケーションフェーズでは、最初のピットを占め、時間値をマウントし、それにレンダリング後部に取り付けられています。)

三、VUEのライフサイクルの基本的な機能

1.ライフサイクルVueのは何ですか?

:破壊の創造からVueのインスタンスプロセスは、ライフサイクルです。それは、創造の初めから、初期化データで、コンパイル済みのテンプレート、、DOMをマウント>アップデートのレンダリング - >レンダリングプロセスのシリーズをアンロード、レンダリングを。

2、ライフサイクルでのVueの役割?

:これは、複数のイベントのライフサイクルですので、我々は全体のプロセスのVueのインスタンスを制御する優れたロジックを形成することが容易です。

3、ページのロードをトリガするいくつかのフックの最初の?

答:会触发beforeCreate、作成、beforeMountは、マウント

図4に示すように、フック関数

(1)beforeCreate:変数データのこの宣言の前

(2)作成した:Vueのインスタンスが作成され、変数の割り当てを、通常バックエンドAJAXからデータを取得するために使用

前に前にDOMをマウントし、データのレンダリング:(3)beforeMount

ページ上の要素を置き換えるために内部$エルヴュー続い,:(4)に取り付けられ

update->(5)内のデータ修正データを、してからページを更新

(6)beforeDestroyは、destroed:インスタンスを破棄し、VUEのインスタンスがまだ存在するが、イベントのアンバンドリングを聞くことビューと結合オブジェクトデータがウォッチャ、すなわち、データ駆動されます

注: ELのテンプレートの両方が存在する場合VUEインスタンス;テンプレートテンプレートは、VUEスコープ(DIVテリトリー)を上書きします

mount挂载的含义:Vue实例中的el、data 去替换vue作用域(div领地)

おすすめ

転載: www.cnblogs.com/hq82/p/11488656.html