如何在 vue.js 文件中注释代码？

Question

我需要在 vue.js 文件中插入注释以供将来参考，但我在文档中找不到您如何执行此操作。

I have tried // , /**/ , {{-- --}} , and {# #} , but none of them seem to work.

我正在使用 Laravel 的刀片。所以这是 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>

有谁知道如何插入评论和/或如何评论代码片段？

原文由 Pathros 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

在您的情况下，您可能希望在 <template> 标记中使用标准 HTML 注释。它们也会从输出中删除，这很好。

 <!-- Comment -->

原文由 Bill Criswell 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

正如 Bill Criswell 所说，我们可以使用 HTML 注释语法。

 <!-- Comment -->

但是，它也可以在模板标签之外工作， comment.vue

 <!-- 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>

原文由 Vaisakh Rajagopal 发布，翻译遵循 CC BY-SA 4.0 许可协议