Contoh terperinci kaedah $on vue

Vue.js ialah rangka kerja bahagian hadapan progresif yang menyediakan pembangun dengan API dan alatan yang kaya untuk membina antara muka pengguna yang kompleks dan aplikasi satu halaman dengan mudah. Salah satu kaedah yang sangat berguna ialah kaedah $on, yang akan diterangkan dan ditunjukkan secara terperinci dalam artikel ini.

Kaedah $on ialah kaedah contoh bagi objek Vue Ia digunakan terutamanya untuk mendengar peristiwa tersuai dalam tika Vue Apabila peristiwa tersuai dicetuskan, fungsi panggil balik boleh dilaksanakan untuk bertindak balas peristiwa itu. Sintaks kaedah $on adalah seperti berikut:

vm.$on(event, callback)

di mana vm mewakili tika Vue, acara mewakili nama acara tersuai yang dipantau dan panggilan balik mewakili fungsi panggil balik yang akan dilaksanakan apabila acara dicetuskan .

Sebagai contoh, kami mencipta tika Vue dan kemudian mendengar acara tersuai bernama "ujian" pada tika itu, seperti yang ditunjukkan di bawah:

var vm = new Vue();
vm.$on("test", function () {
  console.log("test事件被触发了！");
});

Dalam contoh ini, kami menggunakan $ pada kaedah dalam contoh Vue untuk mendengar acara tersuai "ujian", dan menggunakan fungsi tanpa nama sebagai fungsi panggil balik. Fungsi ini akan dilaksanakan apabila peristiwa "ujian" dicetuskan.

Sekarang mari kita lihat cara mencetuskan acara tersuai. Kita boleh menggunakan kaedah $emit untuk mencetuskan peristiwa tersuai seperti berikut:

vm.$emit("test");

Dalam contoh ini, kami menggunakan kaedah $emit untuk mencetuskan peristiwa tersuai bernama "ujian". Apabila kita memanggil kaedah $emit, fungsi panggil balik yang ditakrifkan dalam kaedah $on akan dilaksanakan dan mesej "peristiwa ujian telah dicetuskan!"

Selain kaedah $emit, terdapat beberapa kaedah lain yang boleh digunakan untuk mencetuskan acara tersuai, seperti kaedah $dispatch dan $broadcast. Tiada naratif diberikan di sini.

Perlu diambil perhatian bahawa fungsi panggil balik yang didaftarkan dalam kaedah $on tidak akan dilaksanakan serta-merta. Apabila peristiwa ini dicetuskan, tika Vue akan memanggil semua fungsi panggil balik berdaftar mengikut urutan. Jika kaedah $emit dipanggil sejurus selepas kaedah $on, fungsi panggil balik mungkin tidak dapat dilaksanakan kerana acara itu belum didengari.

Apabila menggunakan kaedah $on, anda juga boleh menghantar parameter pilihan untuk menentukan konteks pelaksanaan fungsi panggil balik, seperti yang ditunjukkan di bawah:

vm.$on("test", function () {
  console.log(this.message);
}, { message: "Hello World!" });

Dalam contoh ini, kami menggunakan objek untuk lulus parameter konteks pelaksanaan. Jelas sekali, dalam fungsi panggil balik, this.message akan menunjuk kepada rentetan "Hello World!" Ciri ini menjadikan fungsi panggil balik lebih fleksibel dan boleh disesuaikan.

Akhir sekali, perlu diingat bahawa kaedah $on hanya memantau peristiwa tersuai pada tika Vue semasa dan tidak akan menjejaskan kejadian lain. Jika anda ingin berkongsi acara tersuai antara berbilang kejadian, pertimbangkan untuk menggunakan mekanisme bas acara tika Vue.

Ringkasnya, kaedah $on ialah kaedah yang sangat penting dan praktikal dalam rangka kerja Vue.js. Dengan menggunakan kaedah ini, kami boleh melaksanakan pemantauan dan tindak balas dengan mudah kepada pelbagai acara tersuai.

Atas ialah kandungan terperinci Contoh terperinci kaedah $on vue. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!