vue 项目中命名方法
命名
命名的方法通常有以下几类:
- 命名法说明
- 1).camelCase,形如thisIsAnApple
- 2).PascalCase,形如ThisIsAnApple
- 3).下划线命名法,形如this_is_an_apple ·
- 4).kebab-case,形如this-is-an-apple
说明: 所有的名称,包括文件名都作为大小写敏感来处理
JS
根据不同类型的内容,必须严格采用如下的命名法:
- 变量名:必须使用camelCase
- 参数名:必须使用camelCase
- 函数名:必须使用camelCase
- 方法/属性:必须使用camelCase
- 私有(保护)成员:必须以下划线_开头
- 常量名:必须使用全部大写的下划线命名法,如IS_DEBUG_ENABLED
- 类名:必须使用PascalCase
- 枚举名:必须使用PascalCase
- 枚举的属性:必须使用全部大写的下划线命名法
- 命名空间:必须使用camelCase
- 语义:命名同时还需要关注语义,如:
- 变量名应当使用名词
- boolean类型的应当使用is、has等起头,表示其类型
- 函数名应当用动宾短语
- 类名应当用名词
Vue 项目中的命名
- Store 中的Module 使用 camelCase
- Store 中的Mutation 使用 全部大写的下划线命名法
- Store 中的state/getters/action 使用camelCase
- 组件必须使用PascalCase
- 引用组件时禁止使用别名,模板内组件标签名遵循html 标签命名规范,或者使用组件名
- 组件名必须避免使用Vue保留标签名(包括HTML标签和Vue内部标签)
- 组件文件和组件使用相同的名字
- 前端路由路径使用全小写命名法
HTML
- html 文件名必须使用小写字母
- 标签名必须使用小写字母
- 属性名必须使用小写字母
- 以上名称有多个单词情况下使用中划线分割
- 属性值必须用双引号包围
CSS
- css 文件名必须使用小写字母
- 选择器必须单词全字母小写,多个单词情况下使用中划线分割
- class选择器必须代表相应模块或部件的内容或功能,不得以样式信息进行命名
- id 选择器必须保证页面唯一
- 同一页面,应避免使用相同的 name 与 id