@Click और v-on के बीच का अंतर: Vuejs पर क्लिक करें


160

प्रश्न पर्याप्त स्पष्ट होने चाहिए :)। लेकिन मैं देख सकता हूँ कि कोई उपयोग करता है:

<button @click="function()">press</button>

किसी का उपयोग करें:

<button v-on:click="function()">press</button>

लेकिन वास्तव में दोनों के बीच अंतर क्या है (यदि मौजूद है)

जवाबों:


189

दोनों के बीच कोई अंतर नहीं है, एक दूसरे के लिए सिर्फ एक आशुलिपि है।

V- उपसर्ग आपके टेम्प्लेट में Vue- विशिष्ट विशेषताओं की पहचान के लिए एक दृश्य क्यू के रूप में कार्य करता है। यह उपयोगी है जब आप कुछ मौजूदा मार्कअप में गतिशील व्यवहार को लागू करने के लिए Vue.js का उपयोग कर रहे हैं, लेकिन कुछ अक्सर इस्तेमाल किए जाने वाले निर्देशों के लिए वर्बोज़ महसूस कर सकते हैं। उसी समय, v- उपसर्ग की आवश्यकता कम महत्वपूर्ण हो जाती है जब आप एक एसपीए का निर्माण कर रहे हों जहां Vue.js प्रत्येक टेम्पलेट का प्रबंधन करता है।

<!-- full syntax -->
<a v-on:click="doSomething"></a>
<!-- shorthand -->
<a @click="doSomething"></a>

स्रोत: आधिकारिक दस्तावेज


1
क्या @ के प्रति Vue समुदाय की प्राथमिकता है या क्या यह केवल JetBrains की प्राथमिकता है कि वी-ऑन के उपयोग के बारे में शिकायत की जाए?
किममो हंटिकाका

5
@KimmoHintikka हाँ, शॉर्टकट (@) की ओर किसी तरह की प्राथमिकता है। शासन में शामिल है strongly-recommendedऔर recommendedeslint-प्लगइन-Vue प्रीसेट की। github.com/vuejs/eslint-plugin-vue/blob/master/docs/rules/…
Cobaltway

63

v-bindऔर v-onvuejs html टेम्पलेट में दो बार उपयोग किए जाने वाले निर्देश हैं। इसलिए उन्होंने इन दोनों के लिए एक लघु संकेत प्रदान किया:

आप बदल सकते हैं v-on:साथ@

v-on:click='someFunction'

जैसा:

@click='someFunction'

एक और उदाहरण:

v-on:keyup='someKeyUpFunction'

जैसा:

@keyup='someKeyUpFunction'

इसी तरह, के v-bindसाथ:

v-bind:href='var1'

के रूप में लिखा जा सकता है:

:href='var1'

आशा करता हूँ की ये काम करेगा!


@LorenzoBerti इस जवाब के बारे में कैसे। क्या इससे आपको और समझने में मदद मिली?
नितिन कुमार

जवाब कुछ भी नहीं समझाता है, बस उदाहरण देता है 1/3 जिनमें से पूछे गए प्रश्न के साथ असंगत हैं। माफ़ करना।
जैकब स्ट्रेबेको

v-bind और v-on, vuejs html टेम्पलेट में दो बार उपयोग किए जाने वाले निर्देश हैं। इसलिए उन्होंने उन दोनों के लिए एक शॉर्टहैंड नोटेशन प्रदान किया, मुझे लगता है कि यह सवाल समझाता है। यही कारण है कि क्यू जी एस प्रलेखन के रूप में अच्छी तरह से प्रदान की जाती है :-)
नितिन कुमार

बात यह है कि 4 महीने बाद जवाब दिया गया है कि कोई लिंक नहीं है, कोई उद्धरण नहीं है, और वी-बाइंड के लिए कोलोन-शॉर्टहैंड में फेंक रहा है, जो वास्तव में भ्रम में जोड़ सकता है।
जैकब स्ट्रेबेको

2

वे सामान्य HTML से कुछ अलग दिख सकते हैं, लेकिन: और @ विशेषता नामों के लिए मान्य वर्ण हैं और सभी V..s समर्थित ब्राउज़र इसे सही ढंग से पार्स कर सकते हैं। इसके अलावा, वे अंतिम रूप से प्रस्तुत मार्कअप में दिखाई नहीं देते हैं। शॉर्टहैंड सिंटैक्स पूरी तरह से वैकल्पिक है, लेकिन बाद में इसके उपयोग के बारे में अधिक जानने पर आप इसकी सराहना करेंगे।

स्रोत: आधिकारिक दस्तावेज

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.