vue の ajax は一般的にどのライフサイクルに配置されますか?

vue の Ajax リクエストは通常​​、「作成された」サイクルに配置されます。利点: 1. サーバー データをより速く取得でき、ページの読み込み時間を短縮できます。2. ssr がサポートしていないため、一貫性が向上します。 、フック機能が搭載されています。

このチュートリアルの動作環境: Windows7 システム、vue2.9.6 バージョン、DELL G3 コンピューター。

Vue ライフサイクル

• ##beforeCreate (作成前) : データの観察と初期化中イベントはまだ開始されておらず、データ、ウォッチャー、メソッドはまだ存在しませんが、$route はすでに存在しており、ルーティング情報に基づいてリダイレクトなどの操作が可能です。

• created (作成後): インスタンスの作成後に呼び出されます。この段階で、ウォッチャー、イベント、メソッドを使用してデータにアクセスできます。 、データ観測（データオブザーバー）とイベント/ウォッチャーイベントの設定が完了しました。しかし、ドームはまだ取り付けられていません。この段階では、http リクエスト操作を実行できるようになります。

• beforeMount (マウント前) : HTML を解析して AST ノードを生成し、その AST ノードに基づいてレンダリング関数を動的に生成します。関連するレンダリング関数が初めて呼び出されます (強調を追加)。

• mounted (マウント後): マウント完了後に呼び出され、render 関数を実行して仮想 dom を生成し、仮想 dom を置き換えるリアル dom を作成します。そしてそれをインスタンスにマウントします。イベント監視などの dom 操作が可能です。

• beforeUpdate: vm.data が更新された後、仮想 dom が再レンダリングされる前に呼び出されます。このフックは、vm.data 更新を変更した後、仮想 DOM が再レンダリングされる前に呼び出すことができます。このフックは、vm.data 更新を変更した後、仮想 DOM が再レンダリングされる前に呼び出すことができます。このフックでは、vm.data を変更できますが、追加のバッファリングやレンダリングのプロセスはトリガーされません。

• updated: 仮想 dom が再レンダリングされた後に呼び出されます。$vm.data が再度変更されると、beforeUpdate と updated が再びトリガーされ、無限大の値が入力されます。ループ。

• beforeDestroy: インスタンスが破棄される前に呼び出されます。つまり、この段階ではインスタンスをまだ呼び出すことができます。

• destroyed: インスタンスが破棄され、すべてのイベント リスナーが削除され、子インスタンスが破棄された後に呼び出されます

ajax は vue のどのライフサイクルに配置されますか?

通常、データ リクエストは作成済みおよびマウント済みで送信できますが、ほとんどの場合、リクエストは作成済みで送信されます。

作成された使用シナリオ: ページが初めてレンダリングされる場合、それはバックエンド データから取得されます。この時点でデータは vue インスタンスにマウントされているためです。

In created (最初に選択したデータをバックエンドから取得したい場合は、ここでリクエストを送信します) (非同期リクエストのみが送信され、レンダリングはバックエンドが応答した後に実行されます)、beforeMount、mounted ( リクエストの送信in Mounted は二次レンダリングを実行し、これら 3 つのフック関数を呼び出します。

これら 3 つのフック関数でデータが作成されているため、サーバーから返されたデータを割り当てることができます。ただし、最も一般的に使用される方法は、作成されたフック関数で非同期リクエストを呼び出すことです。なぜなら、作成されたフック関数で非同期リクエストを呼び出すためです。

メリット:

最初のポイント:より高速になる可能性があります サーバー側のデータを取得し、ページの読み込み時間を短縮します;

2 番目のポイント: ssr は beforeMount およびマウントされたフック関数をサポートしていないため、created に置くと一貫性が向上します。

[関連する推奨事項:

vue.js チュートリアル]

以上がvue の ajax は一般的にどのライフサイクルに配置されますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。