小程序開發的40個技術竅門，純干貨！
2018-01-02
微信“小程序”正式上線一周時間，相關話題持續升溫。支付寶開發“小程序”的消息也隨即曝出，互聯網巨頭們摩拳擦掌，不少網友調侃說，這勢頭感覺要挑戰現有的“APP帝國”了。那么，面對如此炙手可熱的小程序，WeX5移動開發云也沒有閑著，經過全網搜索，為大家篩選出一條小程序開發者的必讀文章，內容涵蓋小程序開發實戰需要注意的40個技術點，供大家參考！
Q:為什么腳本內不能使用window等對象
A:頁面的腳本邏輯是在JsCore中運行，JsCore是一個沒有窗口對象的環境，所以不能在腳本中使用window，也無法在腳本中操作組件
Q:為什么 zepto/jquery 無法使用
A:zepto/jquery 會使用到window對象和document對象，所以無法使用。
Q:wx.navigateTo無法打開頁面
A:一個應用同時只能打開5個頁面，當已經打開了5個頁面之后，wx.navigateTo不能正常打開新頁面。請避免多層級的交互方式，或者使用wx.redirectTo
Q:樣式表不支持級聯選擇器
A:WXSS支持以.開始的類選擇器。
Q：本地資源無法通過 css 獲取
A：background-image：可以使用網絡圖片，或者 base64，或者使用<image/>標簽
Q：如何修改窗口的背景色
A：使用 page 標簽選擇器，可以修改頂層節點的樣式
page {
display: block;
min-height: 100%;
background-color: red;
}
Q：為什么上傳不成功
A：為了提升體驗流暢度，編譯后的代碼包大小需小于 1MB ，大于 1MB 的代碼包將上傳失敗。
Q：HTTPS 請求不成功
A：tls 僅支持 1.2 及以上版本
Q：網絡請求的 referer
A：網絡請求的 referer 是不可以設置的，格式固定為 https://servicewechat.com/{appid}/{version}/page-frame.html，其中 {appid} 為小程序的 appid，{version} 為小程序的版本號，版本號為 0 表示為開發版。
Q：不能直接操作 Page.data
A：避免在直接對 Page.data 進行賦值修改，請使用 Page.setData 進行操作才能將數據同步到頁面中進行渲染怎么獲取用戶輸入
能夠獲取用戶輸入的組件，需要使用組件的屬性bindchange將用戶的輸入內容同步到 AppService。
<input id="myInput" bindchange="bindChange" /><checkbox id="myCheckbox" bindchange="bindChange" />
var inputContent = {}
Page({
data: {
inputContent: {}
},
bindChange: function(e) {
inputContent[e.currentTarget.id] = e.detail.value
}
})
Q：微信小程序支持fetch或者promise嗎?
A：promise工具目前不支持，fetch 客戶端不支持 工具下個版本保持統一。
Q：touchmove滑動事件里面的currentTarget. id值不變動。
A：ouchmove / touchend 事件的 target / currentTarget 會永遠是 touchstart 時的 target / currentTarget 。
Q：wx.request的POST方法的參數傳輸服務器接收不到的bug。
A：wx.request post 的 content-type 默認為 ‘application/json’
如果服務器沒有用到 json 解釋的話，可以把 content-type 設置回 urlencoded。
wx.request({
....
method: "POST",
header: {
"content-type": "application/x-www-form-urlencoded"
},
...
})
Q：wx.uploadFile在手機上返回http碼403。
A：安卓的微信升級到6.5.2及其以上版本。
Q：小程序SVG支持嗎?
A：image的src放遠程svg可以，background-image里也可以。
Q：wx.request返回statusCode兩端類型不一致。
A：確實有這個問題，稍后的版本將會修復。
Q：關于組件的動態生成與銷毀？
A：不支持動態生成組件，但可以用 wx:for 去渲染多個。
Q：小程序支持熱更嗎？
A：不支持開發者自行更替。
Q：一些接口的回調IOS和Android不一致，例如支付接口，用戶取消支付后，ios只回調complete方法，android則回調fail方法，官方文檔也沒有任何回調說明，造成開發很困難；類似的還有圖片選擇接口，分享接口等等。
A：支付接口，用戶取消支付后，ios只回調complete方法，android則回調fail方法，問題已記錄，多謝反饋。
Q：如果icon已經在服務器上了，想用直接訪問網址的方法加載圖片進來這樣可以嗎？
A：不能。
Q：ipad不能使用小程序？
A：暫時不支持ipad打開小程序。
Q：小程序音頻，視頻播放器問題 。1、能夠只隱藏進度條跟時間嗎？2、現在iOS平臺上的時間顯示是0:00，但是android上會顯示錯誤碼，能夠通過什么設置修改嗎？
A：1：下個版本會修改這里的交互，不顯示進度條和時間。2：6.5.3 版本已修復此問題。
Q：拍照窗口可以加浮層嗎？
A：暫時不支持。
Q：開發者工具經常報jsEngineScriptError錯誤，會導致頁面白屏。
A：移步下載最新 0.12.130400 版本的開發工具試試
Q：開發者工具里面，SPA頁面，更改title無效。
A：wx.setNavigationBarTitle可以通過 API 改變導航欄標題。
Q：請問小程序頁內支持長按保存圖片或分享圖片嗎？
A：目前沒有這個功能。
Q：關于swiper中的current問題。如果在新的版本中，直接設current,會產生的效果是：無論從哪個swiper元素點擊進去，都會顯示swiper第一個子元素的值。
A：目前swiper在處理swiper-item動態變化的情況時有一些bug，會很快修復的。
Q：小程序能引用自己服務器上的wxss和js文件嗎？
A：不能，無法執行遠程代碼。
Q：蘋果7，提示內部錯誤，內存占用過多。
A：頁面做的預加載，列表中有圖片，圖片渲染的太多了，解決辦法就是不當屏展示的圖片，不讓它渲染。
Q：小程序體驗者安卓卡在加載頁面進不去，IOS可以進去。
A：這是android微信客戶端舊版本的bug， 請下載最新版本的 6.5.3 客戶端。
Q：請問目前微信小程序支持藍牙嗎？
A：目前不支持。
Q：分享功能真機沒有效果？
A：這是android微信客戶端舊版本的bug， 請下載最新版本的 6.5.3 客戶端。
Q：強制使用https，開發和測試環境下怎么聯調和測試？
A：「微信web開發者工具」->「項目」->「開發環境不校驗請求域名及TLS版本」。
Q：wx.showToast()方法無效。
調用wx.request請求網絡然后在
complete: function (res) {
// complete
wx.hideToast();
}
在成功方法里面如果要進行showToast的時候感覺無效，并沒有彈出提示框。
A：success 回調調用是在 complete 之前的，如果在 success showToast，下一步 complete hideToast 就會被沖掉showToast。
Q：picker 組件中的文字大小是否支持修改？
A：不支持修改。
Q：tabBar的圖片在android和ios上面大小差異太大。
A：這是android微信客戶端舊版本的bug， 請下載最新版本的 6.5.3 客戶端
Q：tabbar 頁面返回問題。非首頁的tabbar 頁面 點擊左上角返回箭頭時如何返回到小程序首頁？ 現在是直接退出小程序了
A：創建新頁面時用 navigateTo 才會新建新頁面，同時保留舊頁面，如果用 redirectTo 是在當前頁面內跳轉。
Q：問下 wx.request() 怎么設置成同步。
A：reqeust是發起網絡請求。沒有同步接口。
Q：最新mac版工具不可用，進來就出現獲取appservice 失敗。
A：工具設置中選擇直接鏈接網絡 。或者 系統中的代理軟件設置工具直接鏈接網絡。
Q：真機 view overflow-y下滑會很卡。
A：父層需要 position:relative; 加了之后就不卡了。
以上就是干貨分享的主要內容，需要提醒的是，小程序本身還在不斷調整、修改、完善之中，對陸續發現的BUG，也需要進行相應的修復。關心小程序開發的朋友請關注我們，獲取最新的小程序開發干貨。
-
廣州
廣州市天河區五山路中公教育大廈1304室
-
佛山
廣東省佛山市順德新展路82號
法律聲明 版權所有 ? 廣州市達美信息科技有限責任公司2013-2025。保留一切權利。粵ICP備17015583號
-
聯系我們
-
關注公眾號
-
達美小程序
服務熱線：13794304162
周一至周五（9：00-18：30）
-
-
線上服務咨詢 -
13794304162
-
請填寫需求索取報價
