Directives dalam Vue.js membolehkan anda menggunakan gelagat istimewa pada elemen dalam DOM. Ia diawali dengan v-
sintaks dan digunakan untuk memanipulasi DOM, mengendalikan acara, memberikan elemen bersyarat dan banyak lagi. Vue.js menyediakan beberapa terbina dalam directives seperti, , dan, yang merangkumi pelbagai kes penggunaan biasa. v-if
v-for
v-bind
v-on
Berikut ialah beberapa perkara biasa directives dalam Vue.js:
1. Arahan: Arahan ini digunakan untuk memberikan unsur secara bersyarat berdasarkan syarat. v-if
Contoh:
<div v-if="isShow">This element is only displayed if isShow is true.</div>
2. Arahan: Arahan ini digunakan untuk lelaran pada tatasusunan atau objek dan mencipta elemen yang sepadan. v-for
Contoh:
<ul>
<li v-for="item in items">{{ item }}</li>
</ul>
3. Arahan: Arahan ini digunakan untuk mengikat nilai ungkapan kepada atribut atau sifat unsur. v-bind
Contoh:
<img v-bind:src="imageUrl">
4. Arahan: Arahan ini digunakan untuk mendengar dan mengendalikan peristiwa pada elemen. v-on
Contoh:
<button v-on:click="handleClick">Click me!</button>
5. Arahan: Arahan ini mewujudkan pengikatan dua hala antara elemen input dan sifat data. v-model
Contoh:
<input v-model="message">
Ini hanyalah beberapa asas directives dalam Vue.js. Anda juga boleh membuat tersuai anda sendiri directives untuk melaksanakan gelagat tertentu dalam aplikasi Vue.js anda.