Cara menggunakan fungsi jam tangan dalam dokumentasi Vue

Vue ialah rangka kerja JavaScript popular yang menyediakan banyak ciri mudah untuk membantu pembangun membina aplikasi dengan lebih mudah. Salah satu ciri penting ialah pengikatan data. Pengikatan data dalam Vue adalah dua hala Apabila data berubah, paparan akan dikemas kini secara automatik. Dalam Vue, kita boleh menggunakan fungsi jam tangan untuk memantau perubahan data.

Fungsi jam tangan ialah hak milik tika Vue. Ia membolehkan kami melakukan beberapa logik tersuai apabila sifat data bagi contoh Vue berubah. Fungsi jam tangan berguna apabila anda ingin melakukan beberapa tindakan apabila data berubah.

Cara menggunakan fungsi jam tangan

Fungsi jam tangan boleh digunakan dalam dua cara: objek atau fungsi. Apabila jam tangan memantau objek, kita perlu menggunakan pasangan "nilai-kunci" untuk menentukan fungsi mendengar. Contohnya:

watch: {
  name: function () {
    // code for handling name changes
  },
  age: function () {
    // code for handling age changes
  }
}

Dalam contoh ini, apabila nilai atribut nama atau atribut umur berubah, Vue akan memanggil fungsi pendengaran yang sepadan untuk melaksanakan kod.

Cara lain ialah mentakrifkan set fungsi dalam jam tangan, yang setiap satunya mendengar sifat. Ia kelihatan seperti ini:

watch: {
  'name': {
    handler: function (val, oldVal) {
      // code for handling name changes
    },
    deep: true
  },
  'age': {
    handler: function (val, oldVal) {
      // code for handling age changes
    },
    immediate: true
  }
}

Dalam contoh ini, "nama" dan "umur" ialah sifat untuk didengari. Pengendali ialah fungsi yang dipanggil apabila sifat yang sepadan berubah. Dalam pengendali, val parameter pertama ialah nilai baharu atribut dan oldVal ialah nilai lama. Parameter ini boleh digunakan untuk menyemak perubahan harta dan melaksanakan kod yang sepadan. Di samping itu, kita juga boleh menetapkan pilihan "dalam" dan "segera" untuk mengawal kelakuan jam tangan.

Pilihan "dalam" menunjukkan sama ada untuk memantau secara mendalam apabila sifat objek berubah. Jika sifat objek berubah, Vue secara lalai hanya mengesan sama ada rujukan kepada objek telah berubah dan tidak akan mengesan sama ada sifat dalam objek telah berubah. Jika kita menggunakan pilihan "dalam", Vue akan memeriksa keseluruhan pokok objek untuk menentukan sifat yang telah berubah. Ini berguna untuk mendengar sifat objek. Contohnya:

watch: {
  user: {
    handler: function () {
      // code for handling user changes
    },
    deep: true
  }
}

Dalam contoh ini, apabila mana-mana sifat objek pengguna berubah, Vue akan secara automatik mengesan perubahan dan memanggil fungsi pengendali.

Pilihan "segera" menunjukkan sama ada fungsi jam tangan dilaksanakan serta-merta selepas tika Vue dibuat. Jika ditetapkan kepada benar, Vue akan memanggil fungsi pengendali serta-merta apabila fungsi jam tangan terikat. Contohnya:

watch: {
  age: {
    handler: function () {
      // code for handling age changes
    },
    immediate: true
  }
}

Dalam contoh ini, walaupun atribut umur tidak berubah, Vue akan segera memanggil fungsi pengendali apabila fungsi jam tangan terikat.

Ringkasan

Jam tangan ialah sifat bagi tika Vue, yang membolehkan kami melakukan beberapa logik tersuai apabila sifat data berubah. Fungsi jam tangan boleh digunakan dalam dua cara: objek dan fungsi. Dalam pendekatan objek kita perlu menggunakan pasangan "nilai-kunci" untuk mentakrifkan fungsi mendengar, manakala dalam pendekatan berfungsi kita perlu mendengar secara manual setiap sifat dan menentukan fungsi mendengar untuk mengendalikan perubahan harta benda. Pada masa yang sama, kami juga boleh menetapkan pilihan "dalam" dan "segera" untuk mengawal kelakuan jam tangan. Menggunakan fungsi jam tangan Vue akan membantu kami menulis aplikasi yang lebih berkuasa dan fleksibel.

Atas ialah kandungan terperinci Cara menggunakan fungsi jam tangan dalam dokumentasi Vue. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!