vue元件命名規範-分享

一個元件在封裝和使用的時候的命名規範–回顧

1.vue2.0版本文檔介紹的以下2種元件命名方式：

第一種：使用 kebab-case（推薦使用這種，遵循 W3C 規範中的自定義元件名：字母全小寫且必須包含一個連字元）

Vue.component('my-component-name', { /* ... */ })
           

第一個參數 my-component-name就是目前元件的名字，是我們自己定義的名字。

當使用 kebab-case (短橫線分隔命名) 定義一個元件時，你也必須在引用這個自定義元素時使用 kebab-case，例如 。

第二種：使用 PascalCase

Vue.component('MyComponentName', { /* ... */ })
           

當使用 PascalCase (首字母大寫命名) 定義一個元件時，你在引用這個自定義元素時兩種命名法都可以使用。也就是說 和 都是可接受的。

注意，盡管如此，直接在 DOM (即非字元串的模闆) 中使用時隻有 kebab-case 是有效的。

分享位址來源：vue.js 官網https://cn.vuejs.org/v2/guide/components-registration.html