前端开发规范
文件命名
为了能准确区分各个文件或资源的用处，需对文件命名进行规范处理。
图片资源
图片资源放置在 "src/assets" 文件夹下
类型 | 描述 | 举例 |
图标[默认] | icon-* | icon-home |
图标[焦点] | icon-*_active | icon-home_active |
背景图 | background-* | background-banner |
logo | logo-* | logo-javashop |
占位图 | placeholder-* | placeholder-image |
其它 | other-* | other-xxx |
Vue文件
单词首字母大写
例如：MyVueFile
JS文件
单词小写
多个单词以横杠隔开
例如：my-js-file
代码中的命名
class命名
单词小写
多个单词以横杠隔开
例如：sidebar-container
js代码
变量、常量
类型 | 描述 | 举例 |
普通变量 | 驼峰式 | const myName = 'XiaoMing' |
临时变量 | _驼峰式 | let _tempArray = new Array(10) |
方法 | 驼峰式 | const myFun = () => {} |
方法[函数]
类型 | 描述 | 举例 |
普通方法 | 驼峰式 | const myFun = () => {} |
用于数据交互 | [交互类型]_[单词首字母大写] | GET_GoodsList 、POST_UserData 、 DELETE_Orders |
其它命名
状态命名
类型 | 描述 | 举例 |
多选 | checked | const checked = true / false |
单选 | checked | const checked = true / false |
下拉选择 | selected | const selected = true / false |
禁用状态 | disabled | const disabled = true / false |
加载中 | loading | const loading = true / false |