Bagaimana untuk Merangkai Panggilan Asynchronous dan Menghantar Data Antaranya dengan Janji jQuery?

Merangkai Panggilan Asynchronous dengan jQuery Promises

Bagaimanakah saya boleh merantai tiga panggilan tak segerak menggunakan janji jQuery dan menghantar data antara mereka?

Apabila berurusan dengan tiga panggilan HTTP yang perlu dilaksanakan secara berurutan, pertimbangkan untuk menggunakan janji jQuery untuk merantai panggilan dan memudahkan pemindahan data.

Pada mulanya, cubaan menggunakan objek tertunda untuk dua fungsi menghasilkan penyelesaian separa. Walau bagaimanapun, melanjutkan pendekatan ini kepada tiga fungsi memerlukan strategi yang berbeza.

Rangkai Panggilan dan Lulus Data

Dalam setiap panggilan, kembalikan objek jqXHR yang dijana oleh $.ajax (). Objek ini mematuhi antara muka Promise dan boleh dirantai menggunakan .then()/.done()/.fail()/.always().

<code class="javascript">function first() {
   return $.ajax(...);
}

function second(data, textStatus, jqXHR) {
   return $.ajax(...);
}

function third(data, textStatus, jqXHR) {
   return $.ajax(...);
}</code>

Dalam fungsi utama, rantaikan fungsi dengan .then() seperti berikut:

<code class="javascript">function main() {
    first().then(second).then(third);
}</code>

Argumen data, textStatus dan jqXHR yang dihantar ke fungsi berikutnya berasal daripada panggilan $.ajax() dalam fungsi sebelumnya. Ini membenarkan setiap fungsi mengakses dan menggunakan output panggilan sebelumnya.

Untuk tujuan ilustrasi, demo di bawah menggunakan $.when('foo') dan bukannya $.ajax(...) untuk menyediakan janji ditepati.

<code class="javascript">function main() {
    $.when('foo').then(second).then(third);
}</code>

Dengan merantai janji dan menghantar data dengan cara ini, anda boleh melaksanakan tiga panggilan tak segerak secara serentak dan berkesan.

Atas ialah kandungan terperinci Bagaimana untuk Merangkai Panggilan Asynchronous dan Menghantar Data Antaranya dengan Janji jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!