1. 组件命名

组件命名统一采用CameCase形式，必须由至少两个单词组成，禁止使用一个单词命名，禁止使用中文和拼音命名

2. Vue属性放置顺序

  1. name

  2. data

  3. props

  4. components

  5. computed

  6. methods

  7. watch

  8. create

  9. mounted

  10. activited

  11. beforeUpdate

  12. updated

  13. beforeDestroyed

  14. destroy

3. 注释规范

示例：

  1.  <!--公用组件：数据表格 
  2. /** 
  3. * 组件名称 
  4. * @module 组件存放位置 
  5. *@desc 组件描述 
  6. *@author 组件作者 
  7. *@date 2017年12月05日17:22:43 
  8. *@param {Object} [title] - 参数说明 
  9. *@param {String} [columns] - 参数说明 
  10. *@example 调用示例 
  11. <hbTable :title="title" :columns="columns" :tableData="tableData"></hbTable> 
  12. */ 
  13. -->

4. 编码规范

4.1 编码风格

统一采用ES6语法风格

  1. 定义变量：变量let 常量：const 常量命名统一采用大写，用下滑下分割，例如：MAX_COUNT,

  2. 模块：导入import 导出export

  3. 尽量减少使用console，debugger,如果必须使用，在 使用过后及时删除

  4. 定义类： class

  5. 异步处理：Promise,async function

  6. 函数采用箭头函数，避免出现bind

  7. 避免使用全局变量

  8. 避免覆盖浏览器原生对象属性和方法，例如Array.prototype.contain

  9. 组件内部不到万不得已，不要操作dom对象

4.2 Vue 组件内部规范

  1. 涉及dom操作的统一采用全局directives

  2. 涉及数据转换和处理的统一采用全局filters,filter函数尽量为纯函数

  3. props 尽量描述详细，至少写出类型和默认值

  4. 减少for,for in ,for of遍历，采用更加友好的函数，例如Array.filter,Array.reduce,Array.map,Object.keys,Ojbect.values

  5. 组件name属性和组件文件名保持一致

4.3 methods 方法命名规范

  1. 动宾短语（good：jumpPage、openCarInfoDialog）（bad：go、nextPage、show、open、login）

  2. ajax 方法以 get、post 开头，以 data 结尾（good：getListData、postFormData）（bad：takeData、confirmData、getList、postForm）

  3. 事件方法以 on 开头（onTypeChange、onUsernameInput）

  4. 避免使用init、refresh

  5. 尽量使用常用单词开头（set、get、open、close、jump）

  6. 驼峰命名（good: getListData）（bad: get_list_data、getlistData）

4.4 Vue生命周期注意点

  1. 不在 mounted、created 之类的方法写逻辑，取 ajax 数据，可以在 mounted 写一个 getData 方法，去取接口数据，那样这个接口可以复用

  2. 在 created 里面监听 Bus 事件

5.2 异步请求封装

  1. 为了便于复用，在项目根目录简历api文件夹，里面可以根据具体业务逻辑拆分请求模块，每一个异步请求写一个函数，返回Promise对象，方便使用

  2. 请求拦截器统一在单独的一个文件中定义