小程式踩坑

大力美少女發表於2019-04-11

基礎

  • 不要用背景圖,用image標籤定位
  • canvas層級最高,需要在上面寫遮罩層的時候先隱藏
  • ios對fixed的支援不是很好,最好用absolute
  • 切換標籤頁用wx.switch
  • 重寫button樣式,去除button邊框:button:after{border:none}
  • 做好低版本相容,可以用caniuse來判斷
  • wx.getUserInfo已經停用
  • 選項卡用swiper,通過改變current(e.detail)
  • 不分包載入程式碼不能超過2M,要壓縮
  • 不能引用線上靜態資源等

進階:

雖然存在依賴關係,但任意一層都可以單獨拿出來使用

程式碼分層(從下向上)

  • utils層(儲存工具方法)
  • ajax(ajax方法封裝)
  • flux(傳送請求方法,含請求地址)
  • server(前端資料獲取方法封裝,返回資料)
  • page.js(分配資料到頁面)

注意點

相容低版本手機

  • 獲取當前頁面url
    let pages=getCurrentPages();
    let r=pages[pages.length-1].route;

  • 內嵌的webview鋪滿全屏,加過渡狀態

  • 小程式如果設定了分享功能,使用者可能從任意頁面進入
    onlaunch執行的ajax回撥pages監聽不到。時效性很強的東西需要在每個pages中寫,可以用mixin

  • 元件中的data更改,外部無法監聽
    通過triggerEvent觸發外部函式

相關文章