vue单文件组件命名；是不是重要？

Question

单文件vue组件的名字有什么意义？

在这个例子中：

<template>
  <div class="inventory-section">    
    <draggable v-model="itemSectionProps.itemSectionCategory">
      <transition-group>
        <div
          v-for="category in itemSectionProps.itemSectionCategory"
          :key="category.itemSectionCategoryId"
        >
          <!-- <p>{{ category.itemSectionCategoryName }}</p>  -->
          <inventory-section-group :itemSectionGroupProps="category">
          </inventory-section-group>
        </div>
      </transition-group>
    </draggable>
  </div>
</template>

<script>
import InventorySectionGroup from "./InventorySectionGroup";
import draggable from "vuedraggable";

export default {
  name: "Inventory",
  components: {
    InventorySectionGroup,
    draggable,
  },

库存部分组的命名如下：

<script>
import InventoryItem from "./InventorySectionGroupItemC";

export default {
  name: "Do I even have a point?",
  components: {
    InventoryItem,
  },
  props: {
    itemSectionGroupData: {
      type: Object,
    },
  },
};
</script>

那么，组件中的名称重要吗？

经过一些测试，所有组件似乎都能正常工作，只要它们在导入（和使用）时从骆驼转换为 kebap-case。是这样吗？

Answer 1

name 的一个很好的理由是，假设您对文件和组件有命名约定。

例如，如果所有组件都以它们的本来面目命名，但没有附加 comp（即：Inventory.vue 而不是 InventoryComp.vue），并且当您使用它们时，您希望成为更明确地说明它们是什么（组件），所以你想像这样使用这个组件：<inventory-comp />。一个简单的方法是使用 name 属性并在 Inventory.vue:

中这样设置

name: 'InventoryComp` // or inventory-comp

vue单文件组件命名；是不是重要？

vue single file components naming; is it important?

vue.js

vue-component

vuejs2