Vue.js क्लिक इवेंट्स

Vue.js एक बहुत ही शक्तिशाली, सीखने में आसान और पहुंच योग्य पुस्तकालय है कि HTML, CSS और Javascript के ज्ञान के साथ, हम इसमें वेब एप्लिकेशन बनाना शुरू कर सकते हैं। Vue.js पहले से मौजूद एंगुलर और रिएक्ट फ्रेमवर्क से बेहतरीन सुविधाओं को मिलाकर बनाया गया है। यह एक प्रगतिशील और प्रतिक्रियाशील जावास्क्रिप्ट ढांचा है जिसका उपयोग यूआई (यूजर इंटरफेस) और एसपीए (सिंगल-पेज एप्लिकेशन) बनाने के लिए किया जाता है, यही वजह है कि डेवलपर्स Vue.js में एप्लिकेशन विकसित करते समय कोड करना पसंद करते हैं और स्वतंत्रता और आराम महसूस करते हैं। Vue.js में ईवेंट लिसनिंग और हैंडलिंग पर एक नज़र डालें, तो हम जानेंगे कि यह ईवेंट को सुनने और संभालने के लिए v-on निर्देश प्रदान करता है। हम DOM को सुनने और आवश्यक कार्य करने के लिए v-on निर्देश का उपयोग कर सकते हैं। यह कई ईवेंट हैंडलर भी प्रदान करता है। हालाँकि, इस लेख में, हम केवल सीखेंगे और क्लिक घटनाओं पर अपना ध्यान केंद्रित रखेंगे। तो चलो शुरू हो जाओ!

जावास्क्रिप्ट के ऑनक्लिक ईवेंट की तरह ही, Vue.js घटनाओं को सुनने के लिए v-on:click प्रदान करता है।

v-on:click ईवेंट का सिंटैक्स इस प्रकार होगा:

Vue.js, v-on का भी उपयोग करने के बजाय एक आशुलिपि @ प्रदान करता है।

Vue.js केवल क्लिक ईवेंट को सुनने और फ़ंक्शन को कॉल करने तक ही सीमित नहीं है। यह हमें किसी भी अंकगणितीय ऑपरेशन या जावास्क्रिप्ट से संबंधित किसी भी चीज़ को उद्धरण चिह्नों के अंदर सीधे लिखने की अनुमति देगा। सिर्फ इस तरह:

Vue.js हमें इनलाइन जावास्क्रिप्ट स्टेटमेंट में मेथड या फंक्शन को कॉल करने की सुविधा प्रदान करता है, जैसा कि नीचे दिखाया गया है:

Vue.js के ईवेंट हैंडलर्स का उपयोग करके, हम इनलाइन स्टेटमेंट का उपयोग करके DOM ईवेंट को भी एक्सेस कर सकते हैं, Vue.js के विशेष रूप से प्रदान किए गए $event वैरिएबल को मेथड के तर्क में पास करके, ठीक नीचे दिए गए उदाहरण की तरह:

Vue.js हमें कई फ़ंक्शन या विधियों को कॉल करने की सुविधा भी प्रदान करता है। हम एक से अधिक फ़ंक्शन को कॉल कर सकते हैं और उन्हें अल्पविराम से अलग कर सकते हैं, इस उदाहरण की तरह:

Vue.js ईवेंट संशोधक भी प्रदान करता है।

घटना संशोधक

हमें अक्सर घटनाओं के साथ संशोधक को कॉल करने की आवश्यकता होती है। तो, Vue.js निम्नलिखित में से कुछ संशोधक प्रदान करता है:

।विराम

यह क्लिक इवेंट के प्रसारण को रोक देगा।

।रोकना

यह पृष्ठ को पुनः लोड या पुनर्निर्देशित करने से रोकेगा।

।एक बार

यह क्लिक इवेंट को केवल एक बार ट्रिगर करेगा।

।कब्जा

इसका उपयोग ज्यादातर ईवेंट श्रोता को जोड़ने के लिए किया जाता है।

हम संशोधक को भी श्रृंखलाबद्ध कर सकते हैं। हालांकि, ध्यान रखें कि संशोधक का क्रम मायने रखता है, और यह परिणामों को प्रभावित करेगा।

निष्कर्ष

इस लेख में, हमने नोब से लेकर निंजा स्तर तक की संपूर्ण क्लिक इवेंट हैंडलिंग अवधारणाओं को कवर किया है। हमने क्लिक ईवेंट लिखने के विभिन्न सिंटैक्स और उपयोग करने के विभिन्न तरीकों के बारे में सीखा है |_+_| डेवलपर्स और विभिन्न ईवेंट संशोधक की आसानी के लिए Vue.js द्वारा प्रदान किया गया निर्देश। Vue.js से संबंधित इस तरह की और उपयोगी सामग्री के लिए linuxhint.com पर विजिट करते रहें।