একটি vue.js ফাইলে কোড কীভাবে মন্তব্য করবেন?


94

ভবিষ্যতের রেফারেন্সের জন্য আমার vue.js ফাইলের মধ্যে একটি মন্তব্য inোকানোর প্রয়োজন আছে, তবে আপনি কীভাবে ডক্সে এটি করেন তা আমি খুঁজে পাই না।

আমি চেষ্টা করেছি //, /**/, {{-- --}}, এবং {# #}, কিন্তু তাদের কেউ কাজ বলে মনে হচ্ছে।

আমি লারাভেলের ব্লেড ব্যবহার করছি। সুতরাং এটি হল sample_file.vue:

<template>
    <div class="media">

        <like-button :post="post" v-if="post.likedByCurrentUser === false && "></like-button>  {{--I want to comment this but I get an error from the gulp watch: post.canBeLikedByCurrentUser === true--}}

        <div class="media-left">
            <a href="#">
                <img class="media-object" v-bind:src="post.user.avatar" v-bind:title="post.user.name + ' image from Gravatar'">
            </a>
        </div>
        <div class="media-body">
            <strong>{{ post.user.name }}</strong>
            <p>{{post.body}}</p>
            <p>{{post.likeCount}} {{ pluralize('like', post.likeCount) }}</p>
        </div>
    </div>
</template> 

কেউ কীভাবে একটি মন্তব্য sertোকাতে এবং / অথবা কোডের টুকরো মন্তব্য করতে জানেন?


4
আপনি একাধিক লাইনে মন্তব্য খুঁজছেন থাকেন, তবে মান এইচটিএমএল মন্তব্য কাজ করবে: <!-- -->। তবে মনে হচ্ছে আপনি কি ইনলাইন মন্তব্য খুঁজছেন?
আদম

আহ, আমি চেষ্টা করতে ভুলে গেছি। এটা আসলে HTMLকোড! Thnx
পাঠ্রস

4
ডিফল্টরূপে এইচটিএমএল মন্তব্যগুলি vuejs.org/v2/api/#
মাইক 3355

4
Vue এর টেমপ্লেট সিনট্যাক্স খুব অনুরূপ handlebars । এটি লক্ষণীয় যে হ্যান্ডলবারগুলি অনুমতি দেয় {{! comments like this }}এবং {{!-- comments {{like this}} that can contain double-braces --}}। এগুলি আউটপুটে রেন্ডার হয় না, <!-- html comments -->যা এর বিপরীতে হয় । আমি উভয় {{! ... }}এবং {{!-- ... --}}ভ্যুর সাথে চেষ্টা করেছিলাম , এবং দুর্ভাগ্যক্রমে তারা সমর্থিত নয়। আপনি যে ব্যবহারকারীদের এতে হোঁচট খাচ্ছেন তাদের জন্য কি আপনার প্রশ্নে এগুলি যুক্ত করার বিষয়ে বিবেচনা করবেন?
ছারভে

উত্তর:


167

আপনি <template>আপনার পরিস্থিতিতে ট্যাগটিতে স্ট্যান্ডার্ড এইচটিএমএল মন্তব্য ব্যবহার করতে চান । এগুলি আউটপুট থেকে ছিনিয়ে নেওয়া হবে যা দুর্দান্ত।

<!-- Comment -->

27

যেমন বিল ক্রিসওয়েল বলেছেন আমরা HTML মন্তব্য সিনট্যাক্স ব্যবহার করতে পারি।

<!-- Comment -->

তবে, এটি টেমপ্লেট ট্যাগের বাইরেও কাজ করবে, কমেন্ট.ভ্যু

<!-- Testing comments, this will work too. -->

<template>
    <!-- This will work too -->

    <div>
        <!-- Html Comments -->
        Hello There!
    </div>
</template>

<style><style>

<!-- Commenting here -->

<script>
    // Commenting only 1 line

    /**
      * Commenting multiple lines
      * Commenting multiple lines
      */
</script>

4
এর ফলে "অপ্রত্যাশিত টোকেন (1: 1)" ভ্যু 2.5.13 এর সাথে ফলাফল দেয়।
অ্যালেন সিলজাক

আমি সমর্থিত মূল ট্যাগগুলির বাইরে মন্তব্য করতাম এবং মন্তব্যগুলির সামগ্রীর উপর নির্ভর করে এটি সমস্যার কারণ হতে পেরেছিলাম। আমি মূল ট্যাগগুলির বাইরে মন্তব্যগুলি সমর্থন করতে চাই কারণ এটি README এবং এ জাতীয় তৈরি করার জন্য সবচেয়ে বুদ্ধিমান জায়গা, তবে ওহ ভাল।
aaaaaa

সমর্থিত মূল ট্যাবগুলির বাইরে মন্তব্যগুলি ব্যবহার করার পরিবর্তে সেখানে বৈধ ট্যাগ ব্যবহার করুন। <comment>Commenting here</comment। এগুলি আপনার আপনার ওয়েবপ্যাক কনফিগারেশনে যুক্ত করতে হবে। vue-loader.vuejs.org/guide/custom-blocks.html# উদাহরণ
ডেভিড আর

17

আমি সবেমাত্র এটি পরীক্ষা করেছি:

<template>
    {{ /* this is a comment */ }}
    <h1>Hello world</h1>
</template>

4
দুর্দান্ত, এটি এইচটিএমএল আউটপুটে প্রদর্শিত হবে না। তবে এই সিনট্যাক্সের সাহায্যে কেবল এক-লাইন মন্তব্য সমর্থিত।
d9k

9

আমি লক্ষ্য করেছি যে আপনি যখন কোনও ট্যাগের ভিতরে থাকেন তখন আপনি মন্তব্য করতে পারবেন না:

<!-- make sure it is outside a tag -->

<autocomplete
<!-- you can't place the comment out in here -->
>
</autocomplete>

4

ভ্যু স্টাইলগুইডস্টে সেরা অনুশীলন রয়েছে এবং কীভাবে আপনার উপাদানগুলিকে মন্তব্য করবেন তার উদাহরণ দেখায়। https://vue-styleguidist.github.io/docs/Docamenting.html#code-comments

কিন্তু সাধারণত...

ইন টেমপ্লেট বা HTML বিভাগ ব্যবহার এইচটিএমএল মন্তব্য

<!-- Comment -->

ইন স্ক্রিপ্ট অধ্যায় জাভাস্ক্রিপ্ট প্রতিক্রিয়াগুলি ব্যবহার

// Comment
/* Comment */

ইন শৈলী বিভাগ ব্যবহার সিএসএস মন্তব্য

/* comment */

4

যদি এটি আপনার প্রকল্পগুলির জন্য কার্যকর হয় তবে আপনি কোনও সাজসজ্জা ছাড়াই টেম্পলেটটির উপরে প্লেইন পাঠ্য রাখতে পারেন। আপনি যখন আপনার উপাদানটি সরবরাহ করবেন তখন এটি সম্পূর্ণ উপেক্ষা করা হবে।

This is some documentation about this component
   - some
   - info
<template></template>
<script></script>
<style></style>

0

নিম্নলিখিত টিপটি কমপক্ষে মন্তব্য করার বিষয়ে (ডকুমেন্টিংয়ের মতো) কোড সে সম্পর্কে খুব বেশি নয় , বরং আপনাকে উন্নয়নের সময় সাময়িকভাবে কোডের অংশগুলি এড়িয়ে যাওয়ার অনুমতি দেওয়ার বিষয়ে।

মন্তব্যে যখন ট্যাগগুলি খোলার এবং বন্ধ করার প্রয়োজন হয়, তখন পার্সারটি যেভাবে তাদের সাথে মেলে তাতে অসুবিধা হতে পারে। উদাহরণস্বরূপ নিম্নলিখিত

<!-- I want to comment this <!-- this --> and that --> 

আউটপুট হবে and that -->। একইভাবে /* this will be commented /* and so will this */ but not this */

আমার সমাধানটি হ'ল v-if="false"আমি কোন ব্লকগুলি (অস্থায়ীভাবে) এড়াতে চাই তা নির্দিষ্ট করতে।

<template>
<div>
    Hello
    <div v-if="false">
        Vue will not process whatever's in here.
    </div>
    World!
</div>
</template>

মনে রাখবেন যে আপনার কোডটি নথিভুক্ত করতে সঠিক মন্তব্যগুলির প্রতিস্থাপনে এটি ব্যবহার করা উচিত নয়। বিকাশের সময় আপনি যে ব্লকগুলি এড়িয়ে যেতে চান তার উপর আরও নিয়ন্ত্রণের এটি একটি সহজ উপায়।


-2

আমি Vue.js এ নবুব, কিন্তু //কোডটি জাভাস্ক্রিপ্ট যেভাবেই হোক তাই কাজ করা উচিত। দস্তাবেজের সন্ধানে আমি এই উদাহরণটি পাই । আপনি যদি জাভাস্ক্রিপ্টের প্রথম 2 লাইনটি দেখেন তবে আপনি মন্তব্যগুলি দেখতে পাবেন //

জাভাস্ক্রিপ্ট লিঙ্ক করা ফাইল উদাহরণ:

// Full spec-compliant TodoMVC with localStorage persistence
// and hash-based routing in ~120 effective lines of JavaScript.

...

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