Directive of VueJS with example

vuejs directive

All the Directive and description of VueJs

DirectiveDescription
v-modelEnables two-way data binding between form input elements and Vue instance properties.
v-bind(v-bind:attr) Dynamically binds HTML attributes to Vue instance properties.
v-onAttaches event listeners to DOM elements.
v-ifConditionally renders an element based on a truthy or falsy value of a Vue instance property.
v-else-ifUsed in conjunction with v-if to provide alternative content based on different conditions.
v-elseProvides default content to be rendered if none of the preceding v-if or v-else-if conditions are met.
v-forIterates over an array or object to dynamically generate a list of elements.
v-showConditionally shows or hides an element based on a truthy or falsy value.
v-cloakPrevents the display of mustache interpolations ({{ }}) until Vue has fully compiled the template.
v-slotDefines named slots in templates for components to fill with their own content.
v-slot-scopeProvides an alias (usually slot) to access data passed from a parent component to a child component through slots.
v-prePreserves whitespace and prevents Vue from parsing the content as HTML.
v-textSets the text content of an element.
v-htmlSets the HTML content of an element, allowing for dynamic HTML rendering (use with caution due to potential XSS vulnerabilities).
v-onceRenders an element only once, even if the data it's bound to changes.

Related posts