Directives ve Vue.js vám umožní aplikovat speciální chování na prvky v DOM. Mají předponu se syntaxí v-
a používají se k manipulaci s DOM, zpracování událostí, podmíněnému vykreslování prvků a dalším. Vue.js poskytuje několik vestavěných, jako directives jsou, , a, které pokrývají širokou škálu běžných případů použití. v-if
v-for
v-bind
v-on
Zde jsou některé běžné directives ve Vue.js:
1. Směrnice: Tato směrnice se používá k podmíněnému vykreslení prvku na základě podmínky. v-if
Příklad:
<div v-if="isShow">This element is only displayed if isShow is true.</div>
2. Direktiva: Tato direktiva se používá k iteraci pole nebo objektu a vytvoření odpovídajících prvků. v-for
Příklad:
<ul>
<li v-for="item in items">{{ item }}</li>
</ul>
3. Direktiva: Tato direktiva se používá k navázání hodnoty výrazu na atribut nebo vlastnost prvku. v-bind
Příklad:
<img v-bind:src="imageUrl">
4. Direktiva: Tato direktiva se používá k naslouchání a zpracování událostí na prvku. v-on
Příklad:
<button v-on:click="handleClick">Click me!</button>
5. Směrnice: Tato směrnice vytváří obousměrnou vazbu mezi vstupním prvkem a vlastností dat. v-model
Příklad:
<input v-model="message">
To jsou jen některé základní directives ve Vue.js. Můžete si také vytvořit své vlastní directives, abyste mohli provádět specifické chování ve vaší aplikaci Vue.js.