Directives Vue.js میں: استعمال اور مثالیں۔

Directives Vue.js میں آپ کو DOM میں عناصر پر خصوصی طرز عمل کا اطلاق کرنے کی اجازت دیتا ہے۔ وہ v- نحو کے ساتھ پریفکس ہوتے ہیں اور DOM میں ہیرا پھیری کرنے، واقعات کو ہینڈل کرنے، مشروط طور پر عناصر کو پیش کرنے اور مزید بہت کچھ کرنے کے لیے استعمال ہوتے ہیں۔ Vue.js کئی بلٹ ان فراہم کرتا ہے directives جیسے, اور, جو عام استعمال کے معاملات کی ایک وسیع رینج کا احاطہ کرتا ہے۔ v-if v-for v-bind v-on

یہاں directives Vue.js میں کچھ عام ہیں:

 

1. ہدایت: یہ ہدایت کسی شرط کی بنیاد پر کسی عنصر کو مشروط طور پر پیش کرنے کے لیے استعمال ہوتی ہے۔ 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 ایپلیکیشن میں مخصوص طرز عمل انجام دینے کے لیے اپنی مرضی کے مطابق بھی تشکیل دے سکتے ہیں ۔