Directives i Vue.js lar deg bruke spesiell atferd på elementer i DOM. De er prefiks med syntaksen v-
og brukes til å manipulere DOM, håndtere hendelser, betinget gjengi elementer og mer. Vue.js har flere innebygde directives som, og, som dekker et bredt spekter av vanlige brukstilfeller. v-if
v-for
v-bind
v-on
Her er noen vanlige directives i Vue.js:
1. Direktiv: Dette direktivet brukes til å betinget gjengi et element basert på en betingelse. v-if
Eksempel:
<div v-if="isShow">This element is only displayed if isShow is true.</div>
2. Direktiv: Dette direktivet brukes til å iterere over en matrise eller et objekt og lage tilsvarende elementer. v-for
Eksempel:
<ul>
<li v-for="item in items">{{ item }}</li>
</ul>
3. Direktiv: Dette direktivet brukes til å binde verdien av et uttrykk til et attributt eller en egenskap til et element. v-bind
Eksempel:
<img v-bind:src="imageUrl">
4. Direktiv: Dette direktivet brukes til å lytte til og håndtere hendelser på et element. v-on
Eksempel:
<button v-on:click="handleClick">Click me!</button>
5. Direktiv: Dette direktivet skaper en toveis binding mellom et inngangselement og en dataegenskap. v-model
Eksempel:
<input v-model="message">
Dette er bare noen grunnleggende directives i Vue.js. Du kan også lage din egen tilpassede directives for å utføre spesifikk atferd i Vue.js-applikasjonen din.