Directives i Vue.js låter dig tillämpa speciella beteenden på element i DOM. De har prefix med v- syntaxen och används för att manipulera DOM, hantera händelser, villkorligt rendera element och mer. Vue.js tillhandahåller flera inbyggda directives som, och, som täcker ett brett spektrum av vanliga användningsfall. v-if v-for v-bind v-on
Här är några vanliga directives i Vue.js:
1. Direktiv: Detta direktiv används för att villkorligt återge ett element baserat på ett villkor. v-if
Exempel:
<div v-if="isShow">This element is only displayed if isShow is true.</div>
2. Direktiv: Detta direktiv används för att iterera över en array eller ett objekt och skapa motsvarande element. v-for
Exempel:
<ul>
<li v-for="item in items">{{ item }}</li>
</ul>
3. Direktiv: Detta direktiv används för att binda värdet av ett uttryck till ett attribut eller en egenskap hos ett element. v-bind
Exempel:
<img v-bind:src="imageUrl">
4. Direktiv: Detta direktiv används för att lyssna på och hantera händelser på ett element. v-on
Exempel:
<button v-on:click="handleClick">Click me!</button>
5. Direktiv: Detta direktiv skapar en tvåvägsbindning mellan ett indataelement och en dataegenskap. v-model
Exempel:
<input v-model="message">
Dessa är bara några grundläggande directives i Vue.js. Du kan också skapa din egen anpassade directives för att utföra specifika beteenden i din Vue.js-applikation.