Beberapa peringkat kitaran hayat vue

Terdapat 4 peringkat utama: 1. Peringkat permulaan, termasuk dua peringkat kecil sebelumBuat (sebelum penciptaan) dan dicipta (selepas penciptaan), termasuk sebelumMount (sebelum memuatkan) dan dipasang (memuatkan) Selepas memasuki) dua peringkat kecil; 3. Peringkat kemas kini, termasuk dua peringkat kecil sebelum Kemas kini (sebelum kemas kini) dan dikemas kini (selepas kemas kini 4. Peringkat pemusnahan, dua peringkat kecil sebelum Musnah (sebelum pemusnahan) dan dimusnahkan (selepas pemusnahan) .

Persekitaran pengendalian tutorial ini: sistem windows7, versi vue3, komputer DELL G3.

Kitaran hayat ialah keseluruhan proses daripada penciptaan hingga kemusnahan komponen. Iaitu, satu siri proses daripada mula mencipta, memulakan data, menyusun templat, memasang Dom → rendering, mengemas kini → rendering, menyahpasang, dll. Kami memanggil ini kitaran hayat Vue

Fungsi cangkuk kitaran hayat ialah fungsi yang dicetuskan secara automatik pada titik tertentu dalam kitaran hayat Fungsinya adalah untuk melaksanakan operasi tertentu pada masa tertentu.

Terdapat 11 kitaran hayat Vue secara keseluruhannya Secara umumnya dibahagikan kepada dua bahagian: biasa digunakan dan tidak biasa Mari kita bincangkan peringkat yang biasa digunakan dahulu.

Datang dahulu ke bangunan bandar peta rasmi:

Apa yang biasa kami gunakan boleh dibahagikan kepada 4 peringkat utama dan 8 kaedah

1. Fasa permulaan

1 sebelum Buat (sebelum penciptaan)

Dalam Selepas kejadian dimulakan, konfigurasi acara pemerhati data dan acara/pemerhati dipanggil.

Iaitu, objek vue (komponen) dicipta pada masa ini, tetapi sifat objek vue masih belum terikat, seperti sifat data dan sifat yang dikira, yang tidak mempunyai nilai.

2. dicipta (selepas penciptaan)

Dicetuskan secara automatik apabila contoh komponen dicipta, sifat objek vue mempunyai nilai, tetapi DOM Ia belum dijana lagi, atribut $el belum wujud lagi. Pada masa ini, terdapat data, dan data biasanya diperoleh dalam fungsi cangkuk ini, bagaimanapun, struktur dom belum dihuraikan pada masa ini, jadi dom tidak boleh dikendalikan.

2. Fasa pelekap

3 sebelumGunung (. Sebelum memuatkan)

                                                                                                                                                                                                                                                                                                                                                       Pada peringkat ini, kedua-dua $el dan data contoh vue dimulakan Pada masa ini, ini.$el mempunyai nilai Tetapi ia masih dipasang pada nod dom maya dan data.message. belum diganti.Data belum dipasang pada halaman lagi.

4.

dilekapkan (selepas dimuatkan) Dalam peringkat

dilekapkan

, contoh vue dipasang . , data.message berjaya dipaparkan. Iaitu: asas data telah dipasang pada halaman pada masa ini, jadi data yang betul boleh dilihat pada halaman. Secara umumnya, kami menghantar permintaan tak segerak (ajax, fetch, axios, dll.) ke sini untuk mendapatkan data pada pelayan dan memaparkannya dalam DOM.

3. Fasa Kemas Kini

5

sebelum Kemas Kini (sebelum kemas kini)

Dipanggil apabila data dikemas kini, dalaman (innerHTML) dalam dom yang sepadan dengan objek

vue (komponen) tidak berubah Ini sesuai untuk mengakses DOM sedia ada sebelum mengemas kini, seperti secara manual mengalih keluar pendengar acara yang ditambahkan. Cangkuk ini tidak dipanggil semasa pemaparan bahagian pelayan, kerana hanya pemaparan awal berlaku pada bahagian pelayan.

6.

dikemas kini (Dikemas kini)                                                                                                                                                                                                                                                                                                                                                                                                                  Cangkuk ini akan dipanggil.

4 Peringkat Pemusnahan

7

sebelum Musnah (sebelum kemusnahan) Dipanggil sebelum instance dimusnahkan. Pada langkah ini, contoh masih tersedia sepenuhnya. Cangkuk ini dipaparkan pada bahagian pelayan

Tidak dipanggil semasa

.

8 dimusnahkan (selepas kemusnahan)

Dipanggil selepas instance Vue dimusnahkan . Selepas panggilan, semua yang ditunjukkan oleh tika Vue akan dinyahikat, semua

pendengar acara akan dialih keluar dan semua tika anak akan dimusnahkan. Cangkuk ini

tidak dipanggil semasa pemaparan sebelah pelayan.

5 Baki fungsi cangkuk yang kurang biasa digunakan

Baki tiga fungsi cangkuk digunakan. agak sedikit, hanya belajar mengenainya.

9. diaktifkan (apabila komponen diaktifkan)

     Dipanggil apabila komponen keep-alive diaktifkan. Cangkuk ini tidak dipanggil semasa pemaparan sebelah pelayan.

10 >Keep-alive Dipanggil apabila komponen dinyahaktifkan. Cangkuk ini tidak dipanggil semasa pemaparan sebelah pelayan. 11.

errorCaptured

(baharu dalam 2.5.0+) (apabila ralat ditangkap)

    Dipanggil apabila menangkap ralat daripada komponen keturunan. Cangkuk ini menerima tiga parameter: objek ralat, contoh komponen tempat ralat berlaku dan rentetan yang mengandungi maklumat tentang sumber ralat. Cangkuk ini boleh mengembalikan palsu untuk mengelakkan ralat daripada merambat lebih jauh ke atas. [Cadangan berkaitan: tutorial video vuejs, pembangunan bahagian hadapan web

]

Atas ialah kandungan terperinci Beberapa peringkat kitaran hayat vue. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!