Sveltejs Academy · Pelajaran

onMount: Menjalankan Selepas Pemaparan

Jalankan kod selepas komponen ditambahkan pada DOM.

Pelajaran 1 daripada 413 langkah

onMount: Menjalankan Selepas Pemaparan ialah pelajaran Sveltejs Academy percuma di CoddyKit. Ini ialah pelajaran 1 daripada 4. Anda boleh membaca keseluruhan pelajaran di bawah secara percuma — kemudian berlatih secara praktikal dalam pelayar menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran Sveltejs Academy, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus Sveltejs Academy merangkumi sejumlah 4 pelajaran.

Tujuan onMount

onMount berjalan selepas komponen ditambahkan pada DOM. Sesuai untuk memulakan kerja tak segerak atau mengakses rujukan.

Importkannya

Import daripada svelte di bahagian atas skrip anda.

<script>
  import { onMount } from "svelte";
</script>

Penggunaan Asas

Luluskan fungsi yang berjalan sekali semasa pemasangan.

onMount(() => {
  console.log("mounted");
});

Operasi Tak Segerak

Anda boleh menggunakan async/await di dalamnya atau mengembalikan janji.

onMount(async () => {
  data = await fetch("/api").then(r => r.json());
});

Akses Elemen

Gabungkan dengan bind:this untuk memanipulasi DOM sejurus selepas pemasangan.

onMount(() => inputEl.focus());

Fungsi Pembersihan

Kembalikan fungsi daripada onMount untuk melakukan pembersihan apabila komponen dinyahpasang.

onMount(() => {
  const id = setInterval(tick, 1000);
  return () => clearInterval(id);
});

Pelayan berbanding Pelayar

onMount tidak berjalan semasa SSR. Gunakannya untuk kod khusus pelayar seperti persediaan kanvas atau WebGL.

Berbilang onMount

Anda boleh memanggil onMount beberapa kali dalam satu komponen. Panggilan dijalankan mengikut susunan pengisytiharan.

Langganan

Langgan sumber luaran di sini dan nyahlanggan dalam fungsi pembersihan yang dikembalikan.

Elakkan Kerja Berat

Tangguhkan kerja bukan kritikal atau gunakan requestIdleCallback supaya paparan pertama tidak tersekat.

Perbezaan daripada beforeUpdate

onMount berjalan tepat sekali; beforeUpdate berjalan sebelum setiap kemas kini reaktif.

Semakan Pantas

Bagaimanakah anda membersihkan selang masa yang dimulakan dalam onMount?

Jawab dalam pelajaran interaktif

Ringkasan

onMount berjalan sekali selepas pemasangan; kembalikan fungsi untuk mengendalikan pembersihan; ia tidak pernah berjalan pada pelayan.

Percuma untuk bermula

Pelajari HTML dengan tutor kecerdasan buatan — percuma

Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.

Kursus: 41
Pelajaran: 163

Mula belajar secara percuma Lihat kursus penuh

Soalan Lazim

Adakah pelajaran “onMount: Menjalankan Selepas Pemaparan” percuma?

Ya — teks penuh “onMount: Menjalankan Selepas Pemaparan” boleh dibaca secara percuma di web ini. Untuk berlatih secara interaktif menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7, serta membuka kunci baki kursus Sveltejs Academy, tingkat taraf kepada CoddyKit PRO. Kursus Sveltejs Academy merangkumi sejumlah 4 pelajaran.

Apakah yang akan saya pelajari dalam “onMount: Menjalankan Selepas Pemaparan”?

Jalankan kod selepas komponen ditambahkan pada DOM. Anda berlatih Sveltejs Academy menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.

Adakah saya memerlukan pengalaman untuk memulakan Sveltejs Academy?

Tiada pengalaman terdahulu diperlukan. Pembelajaran Sveltejs Academy di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 1 daripada 4.

Berapa lamakah pelajaran “onMount: Menjalankan Selepas Pemaparan” diambil?

Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.

Bolehkah saya menulis dan menjalankan kod dalam pelajaran Sveltejs Academy ini?

Ya. Setiap pelajaran Sveltejs Academy menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.

Semua pelajaran dalam kursus ini

← Kembali ke Sveltejs Academy