Vue开发规范

规范目的

为提高团队协作效率
便于后台人员添加功能及前端后期优化维护
输出高质量的文档

命名规范

为了让大家书写可维护的代码，而不是一次性的代码
让团队当中其他人看你的代码能一目了然
甚至一段时间时候后你再看你某个时候写的代码也能看

css命名规范

遵循bem命名规范（bem命名规范官方文档）
1）块：具有独立意义的实体（eg: header、container、menu、form、input）
2) 元素：块的一部分，没有独立意义，与块语义相关
3）修饰符：块、元素的修饰标志，使用修饰符更改某些外观、行为

常用Block命名有：
header、container、menu、form、input …
ui开头的为通用基础组件；ui-btn（按钮），ui-input（输入框），ui-cell，ui-panel，ui-actionsheet，feed…
业务页面结合功能进行组件划分，独立业务功能组件，组合页面+功能命名，公用业务抽象业务功能命名；
独立业务功能组件Block

常用元素Element命名有：
hd（头部），bd（主体），ft（底部），lt（左侧），ct（中间），rt（右侧），title（头部标题），menu（头部菜单），list（主体列表,）item（主体列表），icon（左侧图标）, form、input、submit、checkbox、ridio…

常用Modifier命名有：
default（默认）、primary（主要）、success（成功）、error（失败）、danger（危险）、warning（警告）、disabled（禁用），checked（选中），fixed（固定），lg（大号），sm（小号）、xs（超小）、yellow，size-big，color-yellow…

在这里插入代码片

js命名规范

普通变量命名：小驼峰命名法

命名必须是跟需求的内容相关的词
命名是复数的时候需要加s

常量命名：全部大写

使用大写字母和下划线来组合命名，下划线用以分割单词

const MAX_COUNT = 10
const URL = 'https://www.baidu.com/'

组件命名：

声明约定：PascalCase (单词首字母大写命名)
使用约定：kebab-case (短横线分隔命名)

Home.vue
<template>
	<div class="home">
		<home-header></home-header>
		<div class="home__container">
			<ui-button></ui-button>
		</div>
	</div>
</template>
<script>
import UiButton from "./ui/button";
import HomeHeader from "./components/Header";
export default {
    name: "Community",
    components: {
    	UiButton,
    	HomeHeader 
    }
</script>

method 方法命名命名规范：小驼峰式命名

统一使用动词或者动词+名词形式
请求数据方法，以 data 结尾
init、refresh 单词除外，尽量使用常用单词开头（set、get、go、can、has、is）
坏的命名：go、nextPage、show、open、login
好的命名：jumpPage、openCarInfoDialog、getListData、postFormData
函数方法常用的动词：

get 获取/set 设置,
add 增加/remove 删除
create 创建/destory 移除
start 启动/stop 停止
open 打开/close 关闭,
read 读取/write 写入
load 载入/save 保存,
create 创建/destroy 销毁
begin 开始/end 结束,
backup 备份/restore 恢复
import 导入/export 导出,
split 分割/merge 合并
inject 注入/extract 提取,
attach 附着/detach 脱离
bind 绑定/separate 分离,
view 查看/browse 浏览
edit 编辑/modify 修改,
select 选取/mark 标记
copy 复制/paste 粘贴,
undo 撤销/redo 重做
insert 插入/delete 移除,
add 加入/append 添加
clean 清理/clear 清除,
index 索引/sort 排序
find 查找/search 搜索,
increase 增加/decrease 减少
play 播放/pause 暂停,
launch 启动/run 运行
compile 编译/execute 执行,
debug 调试/trace 跟踪
observe 观察/listen 监听,