微信小程序踩過的坑~

1 安全:
在微信開發小程序過程當中，想請求本地JSON文件的假數據來進行數據渲染,發現請求不到數據,後來發現這是小程序的一大特色,微信規定，微信小程序中不知足條件的域名和協議沒法請求，即微信小程序的網絡請求必須走Https協議，就是說微信小程序必定要經過HTTPS加密。最後解決的方案是經過easy-mock完成了本地開發.

2 存儲:
公司開發的一個小程序功能比較多,涉及的頁面也不少,準備在本地預覽時發現,打包後的代碼不容許超過2M(2048KB).最後解決方案:1.UI提供的圖片進行壓縮.2.代碼進行簡化,儘可能寫的精簡 3.背景圖或者一些稍微大點的圖片能夠掛到服務器上使用。

3 頁面跳轉:
當我使用navigateTo方法進行頁面跳轉時,發現跳轉失效,檢查代碼並無什麼問題,後來發現這是小程序的一個限制.TabBar中的list項的配置pagePath，不能其做爲他頁面的跳轉連接。爲了解決這個問題,我使用了wx.switchTab方法

4 頁面跳轉:
不少時候點擊某個模塊區域須要觸發事件跳轉到其餘頁面,可是每每在該模塊區域會有按鈕點擊等觸發功能,所以在綁定按鈕事件時須要進行阻止冒泡行爲,只須要將事件的bind改爲catch,bind 是阻止不了冒泡的, 例如 bindtap 改爲 catchtap

5 頁面跳轉:
在開發列表上拉分頁加載功能時用到了小程序提供的組件scroll-view(可滾動視圖區域),經過bindscrolltolower(滾動到底部/右邊，會觸發 scrolltolower 事件)綁定了一個方法,可是不管我怎麼上拉，並無觸發該方法,發現本身遺漏了一個屬性,須要給scroll-view配上height樣式屬性,這樣才能觸發事件。
代碼以下:

<scroll-view scroll-y style="height:1200rpx" lower-threshold="30rpx" bindscrolltolower="searchScrollLower" ></scroll-view>

6 小程序頁面傳值:
一般咱們想經過頁面列表進行傳值,在綁定的方法裏進行取值會用到data-index="{data}"來進行傳值,在這裏發現了一個小坑。

這是我在列表隨意取得一個傳值名

可是經過打印發現取值的對象名發生了改變,由大寫全轉換成了小寫

所以你們在開發中取值必定要使用小寫~省得出些奇怪的bug

7 小程序底部tabBar:
設計給個人圖片,是4040 前端無法去改變圖片樣式大小,致使在手機上出現模糊效果,仔細查看文檔.發現有這條提示"建議尺寸爲 81px 81px ，當 postion 爲 top 時，此參數無效"立馬叫設計切了個81*81解決了該問題

8 wx.checkSession(OBJECT):
開發者須要調用wx.checkSession接口檢測當前用戶登陸態是否有效。登陸態過時後開發者能夠再調用wx.login獲取新的用戶登陸態。 本人發如今pc端測試會一直檢測狀態成功,一切已真機測試結果爲主,這是個小坑

9 模板消息
在開發者工具,提交表單傳來的formId都是'the formId is a mock one',是由於這是在微信開發器上面運行的,必需要在在真機上運行才能發送正確

10 scroll-view高度
給scroll-view標籤設的高度很差定死,所以作了如下處理
WXML：

<scroll-view scroll-y  style="height:{{scrollHeight}}px;"  bindscrolltolower="searchScrollLower">

js：

wx.getSystemInfo({
  success: function (res) {
    that.setData({
      scrollHeight: parseInt(res.windowHeight) + 200
    })
  }
});

以上是本次小程序碰到的一些小問題,開發時間大概花了2周時間,在之後的項目中,本人會總結更多的坑點~給後來人少走點坑