微信小程序踩坑之路


前段時間公司要求做了一個微信小程序,現在趁着還算空閑,總結一下小程序中所遇到的問題。

有微信提供的文檔接口和開發者工具,完成起來總是感覺那么暢快,但是在手機上預覽后,總是會有這樣那樣的問題:

1、背景圖片的問題

  微信要求打包的小程序不超過1M,也許是出於這個原因,微信不允許用本地圖片,但可以使用image標簽來展示圖片,或者將背景圖轉為base64,也或者用圖片網絡地址也可以,將圖片存到服務器上,但是每次圖片有修改都要重新上傳,如此也是很麻煩;base64圖片編碼如果圖片大的話編碼會很長,但是這種也算方面些;

2、圖片問題:一般頁面背景圖選擇用png格式的圖片,但是在小程序中,一般格式的圖片作為背景圖會很模糊,所以選擇了矢量圖svg來作為背景圖base64轉碼;

3、數據接口:小程序規定接口必須是https的請求,必須在小程序的管理后台配置好請求域名,上傳域名,開發工具可以是http;

4、頁面之間的跳轉:小程序的頁面跳轉有wx.navigateTowx.redirectTo、wx.switchTab、wx.navigateBack四種跳轉方式,同時規定跳轉不能超過5層;跳轉的實現通過bindtap點擊事件或組件navigator 

<navigator url="redirect?title=redirect" open-type="redirect" hover-class="other-navigator-hover">在當前頁打開</navigator>

但是連續點擊的話頁面會進行多次跳轉,這時候我的解決辦法是判斷僅讓點擊一次執行操作;

5、文本框的默認提示文字:當光標到文本框內,獲取焦點時,默認提示文字會閃動,這個沒有去解決;

6、文本框設置為密碼框時:當文本框為密碼框時,type="text",手機鍵盤第一次輸入數字后閃動到字母鍵盤,這個沒有去解決;

7、按鈕的點擊效果:文檔中提示當hover-class="none"時,沒有點擊效果,但是並不是如此;當button按鈕設置為鏤空時,仍然有效果的出現,因此不設置鏤空就可以了;

8、消息提示框類型:小程序只提供了兩種消息提示框類型:success、loading;對於有些需要提示的地方總是不合時宜,因此就自己寫了一個;

9、小程序的布局:布局用了rpx布局,基本適應了大部分手機的大小,但是小屏手機就需要特別適應;

10、錄音功能:小程序的錄音格式是silk的,在其他播放控件上是不能播放的,wx.playVoice是可以播放本地緩存錄音文件的;所以上傳錄音文件必須要進行轉碼,這個我們是有后台進行轉碼處理的。

 

  大概就是這些吧,我的記性不是太好,總之,小程序的整體的框架體系還是極好的。。。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM