ホームページ  >  記事  >  ウェブフロントエンド  >  vue.js にはフック関数がいくつありますか

vue.js にはフック関数がいくつありますか

coldplay.xixi
coldplay.xixiオリジナル
2020-11-24 09:44:076048ブラウズ

vue.js には 8 つのフック関数があります: 1. beforeCreate は作成前に使用されます; 2. created は作成後に使用されます; 3. beforeMount はマウント前に使用されます; 4. Mounted はマウントに使用されます. ロード後; 5. beforeDestroyは破壊の前に使用します。

vue.js にはフック関数がいくつありますか

このチュートリアルの動作環境: Windows 7 システム、Vue バージョン 2.9.6。この方法は、すべてのブランドのコンピューターに適しています。

vue.js には 8 つのフック関数があります:

1. beforeCreate: 作成前

1. 現在の vue のインスタンス化初期化操作はいつか実行されます。このライフサイクル関数では、初期読み込みを行うことができます。

2. データ内のプロパティには、現在の関数ではアクセスできませんが、インスタンス オブジェクトを通じてアクセスできます。 vue

2. created: after create

1. beforeCreate が実行されると、created が実行され、現在の関数では、data

2 のプロパティにアクセスできます。現在のライフサイクル関数が実行されると、データ内のすべてのプロパティとメソッド内のすべてのメソッドが vue インスタンスに追加されます。同時に、

は getter/setter メソッドを vue インスタンスに追加します。データ内のすべてのプロパティ

3. フロントエンドとリアエンドでデータ対話を実行する必要がある場合 (AJAX リクエスト時)、現時点では

# 3 を使用する必要があります。サイクル、beForemount: マウント前

## (レンダリング)

## レンダリング関数が初めて呼び出されました ---- & gt; データとテンプレートがテンプレートと結合されておらず、同時に、HTML ページではレンダリングされていません

ここでは、データの前にデータ内のデータをレンダリングする必要があります。 1. データとテンプレートは結合され、実際の DOM 構造にレンダリングされます。

2. 現在のライフサイクル関数でアクセスできます。実際の DOM 構造には、

3. vue では、 $refs

を介して実際の DOM 構造にアクセスできます。 4. ref は ID に似ており、アクセス時の値は一意である必要があります。 this.$refs.property

を渡すことができます。 5. beforeDestroy :破壊前

関数を実行すると、データとテンプレートの関係が切断されます (あなたが作成したものではありません)

このライフサイクル関数では、引き続きデータのプロパティにアクセスできます

しかし、アクセスすることはできません実際の DOM 構造

7. beforeUpdate: 更新前

データ内の属性が変更される限り、このライフサイクルが実行され、レンダリング関数が再度実行されます

このライフサイクル関数では、データ変更の最終処理を実行でき、最新の DOM 構造とデータにアクセスすることもできます

8. updated:After update

現在のライフサイクル関数では、最新の DOM 構造 (データ更新後の最新の DOM 構造) とデータにアクセスできます。

#関連する学習の推奨事項:

JavaScript ビデオ チュートリアル

以上がvue.js にはフック関数がいくつありますかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。