Directives Vue.js मा: प्रयोग र उदाहरणहरू

Directives Vue.js मा तपाईंलाई DOM मा तत्वहरूमा विशेष व्यवहार लागू गर्न अनुमति दिन्छ। तिनीहरू v- सिन्ट्याक्सको साथ उपसर्ग लगाइएका छन् र DOM हेरफेर गर्न, घटनाहरू ह्यान्डल गर्न, सशर्त रूपमा तत्वहरू, र थप गर्न प्रयोग गरिन्छ। Vue.js ले धेरै बिल्ट-इन प्रदान गर्दछ directives जस्तै, र, जसले सामान्य प्रयोगका केसहरूको विस्तृत दायरालाई कभर गर्दछ। v-if v-for v-bind v-on

यहाँ directives Vue.js मा केहि सामान्य छन्:

 

१. निर्देशक: यो निर्देशन सर्तमा आधारित तत्वलाई सशर्त रूपमा प्रस्तुत गर्न प्रयोग गरिन्छ। v-if

उदाहरण:

<div v-if="isShow">This element is only displayed if isShow is true.</div>

 

2. निर्देशक: यो निर्देशन एरे वा वस्तुमा दोहोर्याउन र सम्बन्धित तत्वहरू सिर्जना गर्न प्रयोग गरिन्छ। v-for

उदाहरण:

<ul>  
  <li v-for="item in items">{{ item }}</li>  
</ul>

 

3. निर्देशक: यो निर्देशन एक विशेषता वा तत्व को एक गुण एक अभिव्यक्ति को मान बाँध्न प्रयोग गरिन्छ। v-bind

उदाहरण:

<img v-bind:src="imageUrl">

 

4. निर्देशक: यो निर्देशन सुन्न र एक तत्व मा घटनाहरू ह्यान्डल गर्न प्रयोग गरिन्छ। v-on

उदाहरण:

 <button v-on:click="handleClick">Click me!</button>

 

5. निर्देशक: यो निर्देशनले इनपुट तत्व र डेटा गुण बीच दुई-तर्फी बाइन्डिङ सिर्जना गर्दछ। v-model

उदाहरण:

<input v-model="message">

 

यी directives Vue.js मा केही आधारभूत मात्र हुन्। directives तपाइँ तपाइँको Vue.js एप्लिकेसनमा विशिष्ट व्यवहारहरू प्रदर्शन गर्न तपाइँको आफ्नै अनुकूलन पनि सिर्जना गर्न सक्नुहुन्छ ।