Directives i Vue.js giver dig mulighed for at anvende speciel adfærd på elementer i DOM. De er præfikset med v-
syntaksen og bruges til at manipulere DOM, håndtere hændelser, betinget gengivelse af elementer og mere. Vue.js har flere indbyggede directives såsom, og, som dækker en lang række almindelige brugssager. v-if
v-for
v-bind
v-on
Her er nogle almindelige directives i Vue.js:
1. Direktiv: Dette direktiv bruges til at betinget gengive et element baseret på en betingelse. v-if
Eksempel:
<div v-if="isShow">This element is only displayed if isShow is true.</div>
2. Direktiv: Dette direktiv bruges til at iterere over et array eller et objekt og skabe tilsvarende elementer. v-for
Eksempel:
<ul>
<li v-for="item in items">{{ item }}</li>
</ul>
3. Direktiv: Dette direktiv bruges til at binde værdien af et udtryk til en attribut eller en egenskab ved et element. v-bind
Eksempel:
<img v-bind:src="imageUrl">
4. Direktiv: Dette direktiv bruges til at lytte til og håndtere begivenheder på et element. v-on
Eksempel:
<button v-on:click="handleClick">Click me!</button>
5. Direktiv: Dette direktiv skaber en tovejsbinding mellem et inputelement og en dataegenskab. v-model
Eksempel:
<input v-model="message">
Disse er blot nogle grundlæggende directives i Vue.js. Du kan også oprette din egen brugerdefinerede directives til at udføre specifik adfærd i din Vue.js-applikation.