1、小駝峰命名法(lowerCamelCase) :第壹個單詞以小寫字母開始,第二個單詞的首字母大寫,例如:firstName、lastName。
2、大駝峰命名法(CamelCase) :每壹個單詞的首字母都采用大寫字母,例如:FirstName、LastName。
3、下劃線命名法(snake_case):下劃線命名法也叫蛇形法,全由小寫字母和下劃線組成,在兩個單詞之間用下滑線連接。例如:first_name。
4、中劃線命名法(kebab-case):中劃線命名法也叫串式命名法,各個單詞之間通過下劃線“-”連接。例如:first-name。
強制使用:中劃線命名法
命名規則:1、文件名不得含有空格
2、文件名建議只使用小寫字母,不使用大寫字母
3、文件名包含多個單詞時,單詞之間建議連詞線 ( - ) 分隔
4、有復數結構式,要使用復數
示例:login 、 error-page、 icons
強制使用:全部大寫字母
為了醒目,某些說明文件的文件名,可以使用大寫字母
示例:README
補充說明: README 標準
◎ 項目簡介。
◎ 註意事項。
◎ 線上的示例地址(測試、正式)。
◎ 支持運行的環境。
◎ 必要的依賴準備,以及如何搭建。
◎ 項目的安裝指南。
◎ 相關的文檔鏈接。
◎ 相關人員的聯系方式。
README.md 示例:
強制使用:小駝峰命名法
命名規則:前綴為動詞,見名知意
1、onXxx 監聽事件的回調
2、handleXxx 處理事件
3、getXxx 獲取某個值
4、setXxx 設置某個值
常見場景:
a、事件處理:
(1).事件主動監聽采用 onXxx ,被動處理使用handleXxx
示例:onXxxSubmit: '提交表單'
handleXxxSizeChange: '處理分頁頁數改變'
handleXxxPageChange: '處理分頁每頁大小改變'
onXxxKeydown: '按下鍵'
(2). 其他命名:元素+click、 元素+change、select+範圍
示例:selectAllXxx: '選擇所有'
xxxCellClick: '當某個單元格被點擊時會觸發該事件'
xxxSortChange: '當表格的排序條件發生變化的時候會觸發該事件'
b、增刪改查處理:
增: addXxx 添加子項
createXxx 創建大項
刪: deleteXxx 真刪除
removeXxx 偽刪除
改:updateXxx
查: getXxx 獲取原始數據需要修改
fetchXxx 原始數據
示例:getUserList: '獲取用戶列表', fetchToken: '取得Token', deleteUser: '刪除用戶', removeTag: '移除標簽', updateUserInfo: '更新用戶信息', addUser: '添加用戶', createAccount: '創建賬戶'
c、API接口函數:
get: getXxxApi
post: postXxxApi
patch: patchXxxApi
delect: delectXxxApi
域名:xxxUrl
壹般屬性變量 強制使用:小駝峰命名法
1、布爾值
命名規則:前綴為判斷性動詞
hasXxx 判斷是否含有某個值。true:含有此值; false:不含有此值
isXxx 判斷是否為某個值。true:為某個值; false:不為某個值
示例:isShow: '是否顯示', isLoading: '是否處於加載中', hasToken: '是否包含Token',
2、數組命名
命名規則:使用名詞+List組合
示例: userList: '用戶列表'
3、私有屬性變量
命名規則:前綴為下劃線(_)後面和變量命名壹樣。
4、枚舉變量 \textcolor{red}{強制使用:大駝峰命名法}
枚舉的屬性使用全大寫字母,單詞間用下劃線隔開。
示例:let TargetState = { READING: 1, READED: 2, APPLIED: 3, READY: 4 };
5、常量: 強制使用:使用全大寫字母,單詞間用下劃線隔開
強制使用:大駝峰命名法
命名規則: 可參考vue官網風格指南
例如: 1、按照功能來命名
2、應用特定樣式和約定的基礎組件 (也就是展示類的、無邏輯的或無狀態的組件) 應該全部以壹個特定的前綴開頭,比如 Base、App 或 V。
3、組件名應該以高級別的 (通常是壹般化描述的) 單詞開頭,以描述性的修飾詞結尾。
示例:components/
|- BaseButton.vue
|- BaseTable.vue
|- BaseIcon.vue
強制使用: 中劃線命名法
命名規則:
1.class、id 、標簽、屬性的命名應該盡量精短、明確,必須以字母開頭命名,且全部字母為小寫,單詞之間統壹使用中劃線 “-” 連接
2.class必須代表相應模塊或部件的內容或功能,不得以樣式信息進行命名。
3.元素 id 必須保證頁面唯壹。
4.禁止創建無樣式信息的 class
示例:
1、盡量不要縮寫、簡寫的單詞。除了 template => tmp、message => msg、image => img、property => prop 這些單詞已經被公認的縮寫
2、可讀性強的命名優先於簡短的命名
3、命名長度最好在 20 個字符以內,避免多長帶來的閱讀不便
4、命名要有具體的含義,避免使用壹些泛指和無具體含義的詞
5、不要使用拼音,更不要使用中文
6、正則表達式用 Exp 結尾
7、ref:使用Ref結尾