大家都知道在微信小程序開發(fā)過程中，我們會經(jīng)常不斷的去調(diào)試、測試小程序功能，今天就和大家詳細(xì)介紹幾款微信小程序調(diào)試工具供開發(fā)者使用。
微信小程序調(diào)試工具主要有7大工具分別為Wxml Panel、Console panel、Sources panel、Network panel、Appdata panel、Storage panel、Sensor panel。
1.Wxml Panel
①用來查看真實(shí)頁面結(jié)構(gòu)和結(jié)構(gòu)對應(yīng)的wxss屬性
②結(jié)合模擬器來修改wxss屬性并查看修改狀態(tài)
操作流程：調(diào)試模塊-選擇器-找到組件對應(yīng)的Wxml 代碼，具體操作如圖所示:
2.Console panel
①主要是用來輸入和調(diào)試代碼，具體操作如圖所示：
②小程序錯誤輸出，會顯示在這里，如圖所示：
3.Sources panel
①主要是用來顯示當(dāng)前項(xiàng)目腳本文件
操作流程：調(diào)試器-Sources – define 函數(shù)-Page 代碼-尾部有 require 的主動調(diào)用，如圖所示：
4.Network panel
①主要用來查看 request和socket 請求狀態(tài)
操作流程：調(diào)試器-Network -header-查看 request header,如圖所示：
溫馨提示：uploadFile 和 downloadFile在Network panel內(nèi)無法查看，暫不支持此功能。
5.Appdata panel
①主要用來查看當(dāng)前項(xiàng)目運(yùn)行小程序Appdata數(shù)據(jù)
②實(shí)時監(jiān)控項(xiàng)目數(shù)據(jù)
③編輯數(shù)據(jù)的時候，需要及時反饋到界面中。
操作流程：如圖所示
6.Storage panel
①主要是用來存儲當(dāng)前項(xiàng)目 wx.setStorage或 wx.setStorageSync數(shù)據(jù)情況。
②可以在工具對數(shù)據(jù)進(jìn)行新增、修改、刪除等操作；
7.Sensor panel
①主要是為了讓開發(fā)者模擬地理位置，具體操作如圖
②用于模擬移動設(shè)備，調(diào)試重力感應(yīng) API，具體操作如下：
以上就是對微信小程序調(diào)試工具教程具體介紹，大家可以看看，還有具體的操作流程，不熟練的可以多操作幾次。如果你對微信小程序開發(fā)工具感興趣，可以多看看。
