小程序開發常見異常收集整理

編譯異常： 

1. Uncaught SyntaxError: Identifier 'onerror' has already been declared：

Uncaught SyntaxError: Identifier 'onerror' has already been declared
    at <anonymous>:1:1
    at EventEmitter.electron.ipcRenderer.on (C:\Program Files\alitools\小程序開發者工具\resources\electron.asar\renderer\web-frame-init.js:36)
    at emitMany (events.js:147)
    at EventEmitter.emit (events.js:224)

疑開發者工具異常，首頁onload（頁面加載）中有打印輸出goods_id，上邊錯誤不影響小程序運行。如下，上邊所說的異常都是發生在goods_id輸出之前，也就是說首頁加載之前就已經報錯了。

這個錯誤並不影響小程序正常運行，自動忽略就好。有時候過段時間重新編譯就沒有了。

2. Uncaught (in promise) {data: "Cannot read property 'toString' of null"：

Uncaught (in promise) {data: "Cannot read property 'toString' of null", headers: undefined, status: -1, error: 19}

經查，是promise封裝中headers參數里邊使用了獲取同步緩存的方法，未做異常處理，而這里必須要使用字符串才可以，加上默認空值就好了，如下：

 3. 單擊事件傳參異常：

VM3645:1 Component "pages/index/index" does not have a method "couponReceive(2)" to handle event "tap".

異常原因：

小程序模板文件中，向綁定的單擊事件傳參需要單獨以data-params的格式傳遞，同時在單擊事件方法中通過進行獲取

4. 開發者工具調試領取卡券提示“參數錯誤”：

如果安卓手機能正常領取卡券，開發者工具模擬器顯示參數錯誤，那么ios手機應該也是不可以正常領取的。之出現這個異常，應該就是你調用wx.addCard 的時候沒有對cardExt進行JSON序列化為字符串導致的：

注：另外需要注意的是，有些時候領取卡券之后需要自動的去調用查看卡券API以打開卡券，這時候就需要將cardList傳給wx.openCard使用，由於wx.addCard和wx.openCard的參數結構並不一樣，這就可能導致在參數重組的過程中出現問題。而由於微信卡券領取過程是不可逆的，所以驗證測試起來是比較麻煩了，往往需要后台不斷的修改清理測試賬號的狀態。所以不能指望光靠調試來完善領取、查看卡券的功能，盡量的在調用微信API之前保證參數的正確無誤之后，再行實際流程驗證測試。在wx.addCard和wx.openCard調用之前可以把定義好的參數控制台輸出，然后return出來，考慮各種情況來驗證這個參數是否正確。

5. 預覽、真機調試異常，Error:系統異常，錯誤碼：-206：

異常原因：疑工具bug；

處理方法：重啟就好了。

---

CSS樣式：

1. 全屏背景不顯示：

/*微信*/
.container { width:100%;
background: url(...) center top / 100% no-repeat;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
}

/*支付寶*/
.container { height:100%;
background: url(...) center top / 100% no-repeat;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
}

如上，微信中全屏容器必須設置高度為100%，而支付寶中必須設置寬度為100%，不然高度就會為0，這個就有點令人費解了。

嘗試將微信小程序中全屏背景容器父層page的所有默認樣式覆蓋到支付寶小程序的父層page上去，還是會有這個問題，所以這個應該是模擬器外圍框架的問題了，有興趣的可以去看下。

 2. 手機端預覽調試按鈕點不了：

 

如圖，自定義loading層級太高，就遮蓋了devtools工具按鈕了，經驗證，devtools按鈕z-index:10000,所有的層的z-index只要小於這個值就可以了。

 

---

工具異常（bug）：

1. 編輯器無法正常輸入代碼、無法輸入中文：

工具bug，等官方解決吧，目前只能使用ctrl(command) + shfit + w進行重啟了（僅僅是手動關閉重新打開工具解決不了）

2. 點擊編譯無反應，模擬器無法正常顯示：

工具bug，出現概率低，同時開了兩個項目窗口，其中一個點擊編譯無反應，模擬器無變化，關閉重新打開仍未解決，后邊把所有開發者工具窗口都關掉重新打開才可以正常編譯。