我嚴重懷疑小程序的微信方后臺的代碼有可能在暗更新
因為昨天我碰到大量的白屏情況,但是之前和今天就完全沒有出現(xiàn)過
昨天沒有任何問題的頁面跳轉,在今天卻迷之跳不過去, 回調顯示成功,但是就是不跳轉.
小程序預覽的原理差不多是把預覽代碼傳到微信服務器,然后在模擬器或者真機上訪問一個遠端的微信網(wǎng)址'window.location.href'
小程序聯(lián)盟真的很贊! 很多坑在這里看過一遍之后差不多都可以避免
本人低級程序員,以下bug不能確保在其它地方可以以相同的原因復現(xiàn).
同時, 出現(xiàn)很多bug的原因是小程序的基本知識還有編碼的基本功不到位造成
路還很長,共勉
目錄
- 資源 (資源加載時候會出現(xiàn)的問題)
- API (api在使用中有可能會碰到)
- 工具 (模擬器和真機調試有可能出現(xiàn)的問題)
- 兼容 (在真機上調試時候有可能出現(xiàn)的問題)
資源篇
- 已解決
在app.wxss里設置了圖片路徑,在IDE里正常無誤,但是在手機上是沒有顯示的,
解決辦法:(這段話位置放那么偏~ )
Paste_Image.png
問題描述
代碼截圖 app.wxss.png
模擬器里的效果.png
手機里的效果.png - 已解決
更新: 以下在模擬器里是可以的但是在手機上是無效的! 原因參考第一條
app.wxss里的圖片路徑要按照組件文件夾的圖片路徑來寫
//用最上面的1來距離
這個樣式最開始在一個pages文件夾里,所以圖片路徑是 ../../imgs/XXX,
按理說如果把這個樣式提取到外面的app.wxss里的話 圖片路徑應該改為./imgs/XXX..
然而改成這樣之后在模擬器都無法生效.
-
已解決
在index點擊跳轉到login時候,標記三的部分沒有寫page()進行實例化,導致2 的頁面加載時候沒加載相應的js
, 會報以下錯
Paste_Image.png
Paste_Image.png
API 篇
- 未解決
用小程序自帶的底部導航組件的話, 沒法實現(xiàn)跟微信原生底部小紅點或者消息提醒的功能 -
已解決
picker使用時候 picker組件里必須要有內容,放一個值為空的變量并沒有作用
Paste_Image.png
這里我如果只保留{{age}}的話, 這個組件是無法觸發(fā)的.
組件里面必須至少要有1個字符(哪怕是1),這個組件才可以被觸發(fā),但是空格是不行
放一個寬高為100%,display:block的view,如果view里沒內容,view是不會顯示的, 必須要在view里放東西,哪怕一個數(shù)字也行.
然后這里只能寫成了這種(原本需求是這個日期選擇器默認狀態(tài)是空,)
-
已解決
沒仔細考證,網(wǎng)上說圖是沒法批量上傳的,所以這里只能用單個上傳,成功后遞歸調用來解決批量上傳.
** 以下代碼有一個錯誤,第十會說到文件上傳的另一個問題**
Paste_Image.png - 已解決
textArea 沒有bindinput事件
之前描述:
有個業(yè)務場景是檢測多行輸入框,如果有值,按鈕立馬變成可點擊.
然而textarea是沒有input事件的, 最后只能用blur進行失去焦點的時候監(jiān)聽
解決辦法:
blur的在電腦上的體驗如描述所說,可是真正在手機上運行的時候, 體驗和需求中的一致...
- 已解決:
wx.uploadFile 中formData參數(shù)問題:
- 這個接口的formData 微信在處理的時候 已經用formData進行了包裝. 所以這里是沒有必要自己用formData來傳遞參數(shù)的(比如注釋掉的代碼)
- 扯淡的是, 傳遞了form格式的參數(shù)之后 在瀏覽器和安卓下, 接口是可以正常使用的, 并不會報什么錯
- 但是! 在ios里 會直接報錯, 不是運行異常,是直接紅色的報錯.!!!!!
Paste_Image.png
- 已解決
navigateTo 和redirectTo的應用區(qū)別
文檔上只說明redirectTo會關閉當前頁面進行跳轉
但真相并不只有這么簡單...
舉例如下- 現(xiàn)在有個場景是進入小程序,ABC三個頁面平級, 現(xiàn)在通過A進入到A1,在A1進行操作后跳轉到B
- 按理說需要要用redirectTo把A1關閉跳轉到B
- 但是這時候有個問題,就是展現(xiàn)的只是純粹的頁面B ,而底部的tabBar消失!
- 解決辦法就是不要用redirectTo 而是繼續(xù)用navigateTo, 雖然A1頁面不會按照預期進行關閉,但是起碼tabBar可以正產顯示出來
預期頁面
實際效果
結論:(瞎嗶嗶而已...)由此可以推測出 navigateTo跳轉的頁面層級其實是同一級, 而用redirectTo 跳轉其實相當于跳轉到一個新的層級. 藍色的則是navigateTo的跳轉,而redirectTo則是橙色跳轉(脫離了當前的層級)
win10的3d畫圖好給力
工具
- 已解決
結論:
手機預覽的時候會進行域名合法校驗的, 模擬器里的關閉域名校驗只是對模擬器有效
問題描述:
- 模擬器里開啟"開發(fā)工具不開啟域名校驗"之后在模擬器里是可以用http的,但是當在手機上預覽的時候http并不能用, 模擬器開的這個 只負責在模擬器里.
-
如果不開啟的話, 并且在APP配置信息里,沒有設置合法域名的話, 在模擬器里是可以使用圖片上傳之類的接口,但是在手機上并不可以
Paste_Image.png
兼容
- 已解決
在手機上 在外部容器給定高度的情況下,容器里的input的高度設100%在ios上是無效的.但是在模擬器和安卓下面是正常的(具體規(guī)律還沒掌握清楚) -
未解決
輸入法掩蓋textarea, 這個bug有一半的概率會出現(xiàn)
Paste_Image.png - 頁面5層的問題:
- 在IDE里 頁面5層之后會
