目錄規(guī)范
1.目錄概述
組件文件
所有組件相關(guān)文件統(tǒng)一放在components目錄下榨为。
圖片文件
項(xiàng)目圖片文件放置于根目錄的images文件夾下押袍，組件獨(dú)有的圖片放在當(dāng)前組件images目錄下
模型文件
模型文件主要用于編寫各類業(yè)務(wù)模型。項(xiàng)目模型文件放置于根目錄的models文件夾下铡原，組件相關(guān)模型放置于components目錄下的models文件夾中。
行為文件
行為文件放在所引用的組件目錄下。
WXML規(guī)范
1.?????WXML規(guī)范
wxml標(biāo)簽可以單獨(dú)出現(xiàn)的情況黍檩，盡量單獨(dú)出現(xiàn)，如<input />始锚。
<input />
控制每行HTML的代碼數(shù)量在50個字符以內(nèi)刽酱，方便閱讀瀏覽，多余的代碼進(jìn)行換行處理瞧捌，標(biāo)簽所帶屬性每個屬性間進(jìn)行換行棵里。
<v-music
wx:if="{{classic.type===200}}"
img="{{classic.img}}"
content="{{classic.content}}"
</v-music>
合理展現(xiàn)分離內(nèi)容，不要使用內(nèi)聯(lián)樣式姐呐。
<image class="tag"></image>
2.?????注釋規(guī)范
除組件外的其他塊級元素殿怜，均需注釋出其功能，并在其上下空出一行與其他代碼進(jìn)行區(qū)分皮钠。
<view>...</view>
//導(dǎo)航欄
<view>...</view>
<view>...</view>
CSS規(guī)范
1.????CSS規(guī)范
在開發(fā)過程中rpx和px均可能用到稳捆，如通常情況下間距使用rpx，字體大小和邊框等使用px麦轰，開發(fā)者根據(jù)實(shí)際情況而定乔夯。
width: 100rpx;
font-size: 14px;
CSS代碼需有明顯的代碼縮進(jìn)。每一個樣式類之間空出一行款侵。
.v-tag{
? ? width: 100%;
}
.v-container{
? ? width: 100%;
}
盡量使用簡寫屬性末荐，并且同一屬性放置在一起，避免散亂新锈。
/**使用簡寫屬性**/
.v-image{
? ? margin: 0 auto;
}
/**同一屬性放在一塊**/
.v-tag{
? ? margin-left: 10rpx;
? ? margin-right: 10rpx
}
采用flex進(jìn)行布局甲脏，禁止使用float以及vertical-align。
.container{
? ? disaplay: flex;
? ? flex-dirextion: row
}
2.?????注釋規(guī)范
成組的wxss規(guī)則之間用塊狀注釋。請勿在代碼后面直接注釋块请。
/** 修改button默認(rèn)的點(diǎn)擊態(tài)樣式類**/
.button-hover {
? ? background-color: red;
}
JS規(guī)范
1.?????JS規(guī)范
命名規(guī)范
變量名以及函數(shù)名統(tǒng)一采用駝峰命名法娜氏，正常情況下函數(shù)名前綴需加上清晰的動詞表示函數(shù)功能，私有函數(shù)或者屬性以下劃線開頭表明墩新。常量需用const 聲明贸弥。
類的命名首字母需大寫。
采用ES6 關(guān)鍵字let定義變量海渊，盡量不使用var
//定義常量
const a = 1
//定義變量
let imageContent = res.data
//函數(shù)命名
getInfo:function(){
? ? return '';
}
//私有函數(shù)
_getInfo:function(){
? ? return '';
}
回調(diào)函數(shù)規(guī)范
回調(diào)函數(shù)統(tǒng)一使用Promise函數(shù)的方式進(jìn)行編寫绵疲，回調(diào)成功的參數(shù)統(tǒng)一為res，錯誤參數(shù)為err臣疑。
// promise 處理回調(diào)
let back = new Promise((resolve, reject) => {
? ? if (/* 異步操作成功 */){
? ? ? ? resolve(value);
? ? } else {
? ? ? ? reject(error);
? ? }
});
back.then((res) => {
? ? ? console.log('成功回調(diào)盔憨！', res);
? ? }).catch((err) => {
? ? ? console.log('失敗回調(diào)！', error);
});
私有函數(shù)以及回調(diào)函數(shù)統(tǒng)一放置在生命周期函數(shù)后讯沈。
刪除js文件中未用到的生命周期函數(shù)郁岩，保持代碼的整潔。
Pages({
? ? data:{
? ? },
? ? onLoad:function(event){
? ? },
? ? _self:function(){
? ? }
})
每個函數(shù)之間用一個空行分離結(jié)構(gòu)芙盘。
數(shù)據(jù)綁定變量定義規(guī)范
所有涉及到數(shù)據(jù)綁定的變量均需在data中初始化驯用。禁止在不定義的情況下直接setData脸秽。
Pages({
? ? data:{
? ? ? ? id : null
? ? },
? ? onLoad:function(event){
? ? ? ? let id = event.target.dataset.id
? ? ? ? this.data.id = id
? ? }
})
點(diǎn)擊事件規(guī)范
點(diǎn)擊事件函數(shù)命名方式為 on + 事件名 或者業(yè)務(wù)名儒老。
onLike: function(event){
}
組件規(guī)范
組件名命名規(guī)范
組件在使用時命名以 “v-”為開頭的組件名，若組件名稱為多個單詞名拼接而成记餐，采用 ' - ' 連接驮樊。組件標(biāo)簽在page頁面使用時推薦使用單閉合標(biāo)簽（此條約束對于包含有slot的組件無效）
v 來源于法語 單詞 ‘vent’ @林間有風(fēng)
<v-movies />
觸發(fā)事件規(guī)范
組件點(diǎn)擊觸發(fā)事件建議用冒號分隔開
<v-component-tag-name bind:myevent="onMyEvent" />
externalClasses命名規(guī)范
命名格式采用如下形式：v-class-{name}，name可自行定義
v-class-icon
組件樣式規(guī)范
所有組件樣式均應(yīng)采用類的寫法片酝，且命名必須以 v- 開頭囚衔，不允許使用內(nèi)聯(lián)樣式以及id樣式
.v-container{
? ? disaplay: flex;
? ? flex-dirextion: row
}
標(biāo)點(diǎn)規(guī)范
JS語句無需以分號結(jié)束，統(tǒng)一省略分號
JS中一致使用反引號 ``或單引號' ' , 不使用雙引號雕沿。
WXML练湿、CSS、JSON中均應(yīng)使用雙引號审轮。
CSS屬性中冒號中后面用一個空格分隔開肥哎。
————————————————
原文鏈接：https://blog.csdn.net/qq_29920751/article/details/87623435
