微信小程式開發技巧及開發工具使用技巧詳解

一：開發技巧

#1、所有的頁面都需要在app. json 檔案中的pages 中以【路徑+頁面名稱】方式註冊(頁面名稱無需新增檔案副檔名)

2、檔案app.json 中pages 中註冊的第一個頁面為小程式的首頁

3、每個頁面的js、json、wxml、wxss 檔案必須有相同的路徑和檔案名稱

4、在js 檔案中直接修改this.data 無效，請使用this.setData() 函數

#5、使用this.setData() 函數單次設定的資料不能超過1024kB

6、小程式目前不支援直接引入node_modules , 開發者需要使用到node_modules 時候建議拷貝出相關的程式碼到小程式的目錄中

7、在元件中可以定義數據，以data-開頭，多個單字由連字符-鏈接，大寫字元會自動轉成小寫，並通過事件傳遞給邏輯層

8、所有元件與屬性都是小寫，以連字符-連接

#9、小程式最多只能同時開啟五個頁面

#10、小程式必須傳送https 協定的請求，且請求位址必須在對應的appid 下註冊安全網域名稱

11、小程式腳本中不允許使用window，也無法在腳本中操作元件

12、為了提升體驗流暢度，編譯後的程式碼包大小需小於1MB ，大於1MB 的程式碼包會上傳失敗

13、使用page 標籤選擇器，可以修改頂層節點的樣式，類似HTML 中的body 標籤

二：開發工具使用技巧

#快速鍵

格式調整

#Ctrl+S：儲存檔案

#Ctrl+[，Ctrl+] ：程式碼行縮排

#########

Ctrl+Shift+[， Ctrl+Shift+]：折疊開啟程式碼區塊

Ctrl +C Ctrl+V：複製貼上，如果沒有選取任何文字則複製貼上一行

#Shift+Alt+F：程式碼格式化

Alt+Up，Alt+Down：上下移動一行

# #Shift+Alt+Up，Shift+Alt+Down：向上向下複製一行

#Ctrl+Shift+Enter：在目前行上方插入一行

Ctrl+Shift+F：全域搜尋

#遊標相關

#Ctrl+End：移到檔案結尾

Ctrl+Home：移動到檔案開頭

#Ctrl+i：選取目前行

Shift+End：選擇從遊標到行尾

Shift+Home：選擇從行首到遊標處

#Ctrl+Shift+L：選取所有符合

##Ctrl+D：選取符合

#Ctrl+U：遊標回退

####介面相關######################## ##############################Ctrl + \：隱藏側邊欄######

Ctrl + m: 開啟或隱藏模擬器

其他

1、修改wxml 和wxss 檔案將會刷新頁面

#2、修改js 和json 檔案將會重新編譯小程式

3、在app.json 檔案中修改註冊目標頁面，將會自動產生該頁面目錄和檔案

4、開發環境不校驗請求安全域名以及TLS 版本選項開啟時可以使小程式在運行時不校驗域名安全性等規則，更有利於開發中的調試，可在專案- 基礎資訊中設定

#5、可在專案- 設定資訊中快速查看目前appid 設定的安全網域名稱

6、手機查看偵錯小程式時可以點選右上角，選擇enable debug 開啟偵錯模式

##########

以上是微信小程式開發技巧及開發工具使用技巧詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！