Vue代码风格

E和弦的根音 · 2021-11-01 · 1200 次浏览

A.必要

1. 组件名应该始终是多个单词的

2. 组件的 data 必须是一个返回对象的函数

3. prop 的定义应该尽量详细,至少需要指定其类型

4. 在组件上总是必须用 key 配合 v-for

5. 永远不要把 v-if 和 v-for 同时用在同一个元素上

6. 在style标签上使用scoped属性

B强烈推荐

1. 保持每个组件单独分成文件

2. 单文件组件的文件名应该要么始终是单词大写开头 (PascalCase),要么始终是横线连接 (kebab-case)

3. 应用特定样式和约定的基础组件 (也就是展示类的、无逻辑的或无状态的组件) 应该全部以一个特定的前缀开头,比如 BaseAppV

4. 只应该拥有单个活跃实例的组件应该以 The 前缀命名,以示其唯一性列如:TheHeading.vue

5. 在声明 prop 的时候,其命名应该始终使用 camelCase,而在模板和 JSX 中应该始终使用 kebab-case

C推荐

1. 组件/实例的选项应该有统一的顺序。
    name -> components -> filters -> extends -> mixins -> props -> data -> computed -> watch -> 生命周期钩子 -> methods

2. 元素 (包括组件) 的 attribute 应该有统一的顺序
    is -> v-for -> (v-if,v-else) -> id -> (ref,key) -> v-model -> 其它 attribute -> v-on -> v-html -> v-text
如果有错误或者不严谨的地方,请务必给予指正,十分感谢。如果喜欢或者有所启发,欢迎评论,对作者也是一种鼓励。
查看评论 - 0 条评论