网站建设jw100,请拿笔记记下新域名,神奇网站,360优化大师下载官网前言 自古中国取名文化博大进深,往往取一个好的名字而绞尽脑汁.那么一个好名字能够带来什么呢? 名字的内涵必需和使用者固有的本性相配套不和名人重名、不易重名、创意新颖#xff0c;真正体现通过名字以区分人的作用响亮上口读起来流畅好听#xff0c;协音美好#xff0c;…前言 自古中国取名文化博大进深,往往取一个好的名字而绞尽脑汁.那么一个好名字能够带来什么呢? 名字的内涵必需和使用者固有的本性相配套不和名人重名、不易重名、创意新颖真正体现通过名字以区分人的作用响亮上口读起来流畅好听协音美好因为声音涵意同样影响人对人也有条件反射易写易记录忌讳笔画过于繁索在程序中的命名又何尝不是呢? 组件的命名和它的功能相配套不与其他业务组件重名,让人一眼就区分不一定要好听酷炫,但是实用.让开发者产生条件反射,看到命名就会想到这个组件的实用场景易写易记,短小却精炼,不繁琐单文件组件的大小写 单文件组件要么始终以大写字母开头(PascalCase)要么始终用-连接(kebab-case)单词大写开头对于代码编辑器的自动补全最为友好因为这使得我们在 JS(X) 和模板中引用组件的方式尽可能的一致。然而混用文件命名方式有的时候会导致大小写不敏感的文件系统的问题这也是横线连接命名同样完全可取的原因。 基础组件命名 应用特定样式和约定的基础组件 (也就是展示类的、无逻辑的或无状态的组件) 应该全部以一个特定的前缀开头比如 Base、App 或 V。 **反例**components/|- button.vue|- loading.vue|- slide.vue
复制代码**正例**components/|- BaseButton.vue|- BaseLoading.vue|- BaseSlide.vue
复制代码单个活跃实例的组件 单个活跃实例的组件应该以 The 前缀命名,以示其唯一性 这不意味着组件只可用于一个单页面而是每个页面只使用一次。这些组件永远不接受任何 prop因为它们是为你的应用定制的而不是它们在你的应用中的上下文。如果你发现有必要添加 prop那就表明这实际上是一个可复用的组件只是目前在每个页面里只使用一次。 **反例**components/|- SaleManage.vue|- ImportExcel.vue
复制代码**正例**components/|- TheSaleManage.vue|- TheImportExcel.vue
复制代码紧密耦合的组件名 和父组件紧密耦合的子组件应该以父组件的命名为前缀.如果一个组件只在其父组件某个场景下有意义,这层关系应该体现在组件名上,因为编辑器通常按照首字母顺序组织文件. **反例**components/|- SearchBox.vue|- SearchItem.vue|- SearchButton.vue
复制代码**正例**components/|- SearchBox.vue|- SearchBoxItem.vue|- SearchBoxButton.vue
复制代码组件命中的单词顺序 组件名应该以高级别的 (通常是一般化描述的) 单词开头以描述性的修饰词结尾。 **反例**components/|- ClearSearchButton.vue|- ExcludeFromSearchInput.vue|- LaunchOnStartupCheckbox.vue|- RunSearchButton.vue|- SearchInput.vue|- TermsCheckbox.vue
复制代码**正例**components/|- SearchButtonClear.vue|- SearchButtonRun.vue|- SearchInputQuery.vue|- SearchInputExcludeGlob.vue|- SettingsCheckboxTerms.vue|- SettingsCheckboxLaunchOnStartup.vue
复制代码完整单词的组件名 编辑器中的自动补全已经相当友好,让书写长的组件名的代价已经可以微乎其微,同样的效率更易于理解,何乐而不为? **反例**components/|- soManage.vue|- woManage.vue
复制代码**正例**components/|- SaleOrderManage.vue|- WorkOrderManage.vue
复制代码prop的大小写 在声明时始终采用(camelCase),在模板和 JSX 中应该始终使用( kebab-case)。 单纯的遵循每个语言的约定。在 JavaScript 中更自然的是 camelCase。而在 HTML 中则是 kebab-case。 **反例**
props: {greeting-text: String
}
WelcomeMessage greetingTexthi/
复制代码**正例**
props: {greetingText: String
}
WelcomeMessage greeting-texthi/
复制代码
