この記事では、vue に関する関連知識を提供します。主に、vue ライフ サイクル フック関数とは何か、いつトリガーされるかを紹介します。vue ライフ サイクルは、誕生から開始までのコンポーネントです。死の完全なサイクル. 皆様のお役に立てれば幸いです。
[関連する推奨事項: javascript ビデオ チュートリアル、vue.js チュートリアル]
Vue のライフサイクルはコンポーネントの誕生から消滅までの完全なサイクルです
主に次の 4 つの段階で構成されます:作成、マウント、更新、破棄
、作成後:
created
、マウント後:
マウントされた
、更新後:
updated
、破壊後:
destroyed
インスタンスのアクティブ化
インスタンスの失敗
全員が理解できればOK:
ライフサイクルフック関数 (11) 関数(型)、青くマークされているものはその型に属することを意味します。beforeCreate 関数は、インスタンスの初期化後、データ オブザーバーおよびイベント/ウォッチャーのイベント構成の前に呼び出されます。
#created 関数はインスタンスの作成直後に呼び出されます。このステップで、インスタンスはデータ オブザーバー、プロパティとメソッドの操作、監視/イベント イベント コールバックの構成を完了します。ただし、マウントフェーズはまだ開始されておらず、$el 属性は現在表示されていません。
beforeMount マウントが開始される前に関数が呼び出されます。関連するレンダリング関数が初めて呼び出されます。
mounted 関数 el は新しく作成された vm.el に置き換えられ、インスタンスにマウントされた後にフックが呼び出されます。ルート インスタンスがドキュメント内要素をマウントする場合、mount が呼び出されたときに vm.$el もドキュメント内にあります。
beforeUpdate データが更新されると、仮想 DOM にパッチが適用される前に関数が呼び出されます。これは、追加されたイベント リスナーを手動で削除するなど、更新前に既存の DOM にアクセスする場合に適しています。サーバー側では最初のレンダリングのみが行われるため、このフックはサーバー側のレンダリング中に呼び出されません。
updated 関数 このフックは、データ変更による仮想 DOM の再レンダリングとパッチ適用後に呼び出されます。
activated コンポーネントがアクティブ化されると、関数 keep-alive が呼び出されます。このフックは、サーバー側のレンダリング中には呼び出されません。
deactivated コンポーネントが非アクティブ化されると、関数 keep-alive が呼び出されます。このフックは、サーバー側のレンダリング中には呼び出されません。
beforeDestroy 関数はインスタンスが破棄される前に呼び出されます。このステップでは、インスタンスはまだ完全に利用可能です。このフックは、サーバー側のレンダリング中には呼び出されません。
destroyed Vue インスタンスが破棄された後に関数が呼び出されます。呼び出されると、Vue インスタンスが指すすべてのバインドが解除され、すべてのイベント リスナーが削除され、すべての子インスタンスが破棄されます。このフックは、サーバー側のレンダリング中には呼び出されません。
(2.5.0 の新機能) (err: Error, vm: Component, info: string) => 子孫コンポーネントからエラーをキャプチャする場合のブール値が呼び出されます。 。このフックは、エラー オブジェクト、エラーが発生したコンポーネント インスタンス、およびエラーの原因に関する情報を含む文字列の 3 つのパラメータを受け取ります。このフックは、エラーがさらに上方に伝播するのを防ぐために false を返すことができます。
PS
キープアライブには、非常に多くの用途があります。
[関連する推奨事項: JavaScript ビデオ チュートリアル 、vue.js チュートリアル ]
以上がVue ライフサイクルフック関数とは何か、またそれらがいつトリガーされるかについて話しましょうの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。