Directives u Vue.js vam omogućuju primjenu posebnih ponašanja na elemente u DOM-u. Imaju prefiks sintakse v- i koriste se za manipuliranje DOM-om, rukovanje događajima, uvjetno renderiranje elemenata i više. Vue.js nudi nekoliko ugrađenih directives kao što su, , i, koji pokrivaju širok raspon uobičajenih slučajeva upotrebe. v-if v-for v-bind v-on
Evo nekih uobičajenih directives u Vue.js:
1. Direktiva: Ova direktiva se koristi za uvjetno prikazivanje elementa na temelju uvjeta. v-if
Primjer:
<div v-if="isShow">This element is only displayed if isShow is true.</div>
2. Direktiva: Ova se direktiva koristi za ponavljanje niza ili objekta i stvaranje odgovarajućih elemenata. v-for
Primjer:
<ul>
<li v-for="item in items">{{ item }}</li>
</ul>
3. Direktiva: Ova direktiva se koristi za vezanje vrijednosti izraza na atribut ili svojstvo elementa. v-bind
Primjer:
<img v-bind:src="imageUrl">
4. Direktiva: Ova direktiva se koristi za slušanje i rukovanje događajima na elementu. v-on
Primjer:
<button v-on:click="handleClick">Click me!</button>
5. Direktiva: Ova direktiva stvara dvosmjerno povezivanje između ulaznog elementa i svojstva podataka. v-model
Primjer:
<input v-model="message">
Ovo su samo neke osnove directives u Vue.js. Također možete stvoriti vlastite prilagođene radnje directives za izvođenje određenih ponašanja u vašoj Vue.js aplikaciji.