@ ক্লিক এবং ভি-অন এর মধ্যে পার্থক্য: ভিউজে ক্লিক করুন


160

প্রশ্নগুলি যথেষ্ট পরিষ্কার হওয়া উচিত :)। তবে আমি দেখতে পাচ্ছি যে কেউ এটি ব্যবহার করছে:

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

কেউ ব্যবহার করুন:

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

তবে সত্যিই দুজনের মধ্যে পার্থক্য কী (যদি বিদ্যমান থাকে)

উত্তর:


188

দুজনের মধ্যে কোনও পার্থক্য নেই, একটি দ্বিতীয়টির জন্য কেবল একটি শর্টহ্যান্ড।

V- উপসর্গটি আপনার টেম্পলেটগুলিতে ভ্যু-নির্দিষ্ট বৈশিষ্ট্যগুলি সনাক্ত করার জন্য ভিজ্যুয়াল কিউ হিসাবে কাজ করে। আপনি যখন বিদ্যমান কিছু মার্কআপে গতিশীল আচরণ প্রয়োগ করতে ভ্যু.জেএস ব্যবহার করছেন তখন এটি কার্যকর হয় তবে কিছু ঘন ঘন ব্যবহৃত নির্দেশাবলীর জন্য ভারবস অনুভব করতে পারেন। একই সাথে, আপনি যখন এমন এসপিএ তৈরি করছেন তখন ভি-উপসর্গের প্রয়োজনীয়তা কম গুরুত্বপূর্ণ হয়ে ওঠে যেখানে ভ্যু.জেস প্রতিটি টেম্পলেট পরিচালনা করে।

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

উত্স: সরকারী ডকুমেন্টেশন


1
@ এর প্রতি ভ্যু সম্প্রদায়ের পছন্দ আছে নাকি ভি-অন ব্যবহার সম্পর্কে অভিযোগ করার জন্য কেবল জেটব্রেইনদের অগ্রাধিকার?
কিম্মো হিন্টিক্কা

5
@ কিম্মোহিন্টিকা হ্যাঁ, শর্টকাটের দিকে কোনওভাবেই অগ্রাধিকার রয়েছে (@)। নিয়ম মধ্যে অন্তর্ভুক্ত করা হয় strongly-recommendedএবং recommendedeslint-প্লাগইন-Vue প্রিসেট করুন। github.com/vuejs/eslint-plugin-vue/blob/master/docs/rules/…
কোবল্টওয়ে

62

v-bindএবং v-onভয়েজ এইচটিএমএল টেমপ্লেটে প্রায়শই ব্যবহৃত দুটি নির্দেশনা। সুতরাং তারা উভয়ের জন্য নিম্নরূপে একটি সংক্ষিপ্ত স্বরলিপি প্রদান করেছেন:

আপনি প্রতিস্থাপন করতে পারেন v-on:সঙ্গে@

v-on:click='someFunction'

যেমন:

@click='someFunction'

আরেকটি উদাহরণ:

v-on:keyup='someKeyUpFunction'

যেমন:

@keyup='someKeyUpFunction'

একইভাবে, v-bindসাথে:

v-bind:href='var1'

হিসাবে লেখা যেতে পারে:

:href='var1'

আশা করি এটা সাহায্য করবে!


এই উত্তর সম্পর্কে @ লরেনজো বার্টি এটি আপনাকে আরও বুঝতে সাহায্য করেছে?
নিতিন কুমার

উত্তরটি কোনও ব্যাখ্যা দেয় না, কেবল 1/3 উদাহরণ দেয় যার মধ্যে জিজ্ঞাসিত প্রশ্নের সাথে অসঙ্গতি রয়েছে। দুঃখিত।
জাকুব স্ট্রেইবাইকো

ভি-বাইন্ড এবং ভি-অন হ'ল ভিউজ এইচটিএমএল টেমপ্লেটে প্রায়শই ব্যবহৃত নির্দেশনা। সুতরাং তারা উভয়ের জন্য একটি সংক্ষিপ্ত স্বরলিপি সরবরাহ করেছে আমার মনে হয় এটি প্রশ্নের ব্যাখ্যা করে। এটি কিউ জেএস ডকুমেন্টেশনেও সরবরাহিত কারণ :-)
নিতিন কুমার

বিষয়টি হ'ল উত্তরটি 4 মাস পরে কোনও লিঙ্ক, কোনও উদ্ধৃতি সহ পোস্ট করা হয়েছে এবং ভি-বাইন্ডের জন্য কোলন-শর্টহ্যান্ডে নিক্ষেপ করা হয়েছে যা আসলে বিভ্রান্তি বাড়িয়ে তুলতে পারে।
জাকুব স্ট্রেইবাইকো

2

এগুলি সাধারণ এইচটিএমএল থেকে কিছুটা আলাদা দেখতে পারে তবে: এবং @ বৈশিষ্ট্যের নামগুলির জন্য বৈধ অক্ষর এবং সমস্ত Vue.js সমর্থিত ব্রাউজারগুলি এটিকে সঠিকভাবে পার্স করতে পারে। তদতিরিক্ত, তারা চূড়ান্ত রেন্ডারড মার্কআপে উপস্থিত হয় না। শর্টহ্যান্ড সিনট্যাক্স সম্পূর্ণরূপে alচ্ছিক, তবে পরে আপনি যদি এর ব্যবহার সম্পর্কে আরও জানবেন তবে আপনি সম্ভবত এটির প্রশংসা করবেন।

উত্স: সরকারী ডকুমেন্টেশন

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.