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,代码空四格