vue代码规范

1，vue文件命名：主文件以 XxxIndex.vue 命名，开头首字母大写；弹窗增删改查组件XxxDialog.vue命名；其他文件以有 Xxx 意义方式命名,尽量以模块英文单词全名命名，不要使用简写;
2，所有的公共方法不再 main.js 里面引入（除了 http,api ）;
3，所有自建.vue文件里面的<style lang="scss"scoped>;
标签要加scoped属性，避免污染全局样式;
4，所有自建.vue data里面的数据必须加注释，注明参数的意义，所有computed，methods,watch里面的方法必须加注释，props父级数据必须加注释，对感觉稍微难点的逻辑判断必须加注释;

/*
 *  多行注释
 */

// 单行注释

5，尽量不要使用$root、$parent、$refs等边界方法;
6，运算符必须用前后空格分开，例如：a === b;
7，v-for必须配合:key一起使用;
8，v-for 和 v-if不要放到一个标签里面使用;
9，标签上的多个属性不要写到一行，应多行分隔;
例如：

<temp-pipe
        v-for="(pipe,index) in db.pipeData"
        :data="pipe"
        :key="'0' + index"
        :downData="pipe.pipe_down"
></temp-pipe>

10，组件表达式（{{}}）应放简单的表达式，复杂的表达式应该放到computed或者methods里面去处理;
11，接口请求的函数名必须加fetchXxxx;
12，点击/鼠标移入事件方法名必须加handleXxxx;
13，所有的列表请求必须加loading处理，包含btn的数据请求；
14，所有模块组件Vue自定义的组件引入方式
例如：

定义：import   TempSwitch   from   './'
引入：<temp-switch></temp-switch>

15，所有公共组件Vue自定义的组件引入方式
例如：

定义：import   CompSwitch   from   './'
引入：<comp-switch></comp-switch>

16，分装的公共方法使用Class类
例如：

class 类名 {
    constructor () {
        // 构造方法
    }
    today () {
      // 自定义方法
    }
}
export default new 类名();
注意：类名一般首字母大写

17，正确使用const(常量) 和let(变量)
18，打包完成之后，尽量要用server.js去跑下打包后的生产文件
19，关闭子级弹窗尽量使用对象的属性去关闭，
例如：父级：

data() {
    return {
        isDialog：{
        show：true
      };
    };
},

子级：

this.isDialog.show = false

20，methods里面的函数代码行不能超过30行，超过30行要子封装
21，现在所有项目的UI组件统一迁移iviews
22,代码空四格

vue代码规范

推荐阅读更多精彩内容