Phenquestions
Vue.js adalah perpustakaan yang mudah dipelajari dan mudah didekati. Oleh itu, dengan pengetahuan HTML, CSS, dan Javascript, kita boleh mula membina aplikasi web di Vue.js. Vue.js dibina dengan menggabungkan ciri-ciri terbaik dari Kerangka Sudut dan tindak balas yang sudah ada.
Pengikatan data adalah salah satu ciri Vue yang paling elegan.js kerana memberikan pengikatan data reaktif / dua hala. Di Vue.js, kita tidak perlu menulis banyak baris untuk mengikat data dua hala, tidak seperti kerangka kerja lain. Pengikatan data sehala bermaksud bahawa pemboleh ubah hanya terikat pada DOM. Sebaliknya, dua hala bermaksud bahawa pemboleh ubah juga terikat dari DOM. Apabila DOM berubah, pemboleh ubah juga berubah. Oleh itu, mari kita lihat kedua-dua pengikatan data dan melihat perbezaan yang tepat.
Pengikatan Data sehala
Sekiranya kita mahu mengikat sebarang pemboleh ubah, kita hanya boleh menggunakan Vue.sintaks pendakap keriting ganda js atau sintaks "misai" untuk mengikat sebarang pemboleh ubah dari contoh komponen relatif.
linuxhintText
Atau, jika kita ingin mengikat sebarang pemboleh ubah di dalam atribut HTML, kita dapat menggunakan v-ikat arahan.
Vue.js juga memberikan singkatan untuk mengikat pemboleh ubah dalam atribut HTML. Daripada menulis v-bind: atribut-nama, kita hanya dapat menggunakan tanda titik ":" dan nama atribut.
Tetapi ini hanya pengikatan data. Untuk menunjukkan pengikatan data dua hala, kita dapat menggunakan model v arahan yang diberikan oleh Vue.js.
Pengikatan Data Dua Hala / Reaktif
Untuk menunjukkan pengikatan data reaktif, kita dapat menggunakan model v arahan pada medan borang input. Ia akan memancarkan peristiwa secara dalaman dan mengubah pemboleh ubahnya. Kita boleh mengikat tempat lain dalam templat menggunakan pendakap kerinting berganda atau sintaks "misai".
Anda sedang menaip: linuxhintText
Sekarang, setiap kali kita memasukkan watak di medan borang input, kita dapat melihat bahawa pemboleh ubah juga dikemas kini secara serentak.
Mengakhiri
Dalam artikel ini, kami telah belajar bagaimana mengikat pemboleh ubah di Vue.js menggunakan pendakap kerinting berganda atau sintaks "misai". Kami juga telah menunjukkan pengikatan data dua arah / reaktif di Vue.js menggunakan arahan model-v. Setelah membaca artikel ini, pengikatan data bukan tugas yang sukar lagi bagi pemula yang baru sahaja memulakan dengan Vue.js. Jadi, teruskan belajar konsep Vue.js dengan linuxhint.com. Terima kasih!
