須知

• App() 必須在 app.js 中注冊(cè)，且不能注冊(cè)多個(gè)。
• 編譯后的代碼包大小需小于 1MB ，否則代碼包將上傳失敗。
• 每個(gè)頁(yè)面需要手動(dòng)在 app.json 中進(jìn)行注冊(cè)，否則不能訪(fǎng)問(wèn)。
• app.json 中 pages 數(shù)組的第一項(xiàng)代表小程序的初始頁(yè)面，小程序中新增/減少頁(yè)面，都需要對(duì) pages 數(shù)組進(jìn)行修改。
• 直接修改 this.data 無(wú)效，無(wú)法改變頁(yè)面的狀態(tài)，還會(huì)造成數(shù)據(jù)不一致。
• 單次設(shè)置的數(shù)據(jù)不能超過(guò) 1024kB ，請(qǐng)盡量避免一次設(shè)置過(guò)多的數(shù)據(jù)。
• 不要嘗試修改頁(yè)面棧，會(huì)導(dǎo)致路由以及頁(yè)面狀態(tài)錯(cuò)誤。
• tabBar 只能配置最少2個(gè)、最多5個(gè)， tab 按數(shù)組的順序排序。
• 小程序頁(yè)面只能同時(shí)打開(kāi) 5 個(gè)，如果交互流程較長(zhǎng)難以支持。
• 同時(shí)只能存在 5 個(gè) url 請(qǐng)求。
• 無(wú)法跳轉(zhuǎn)小程序以外的 url 。
• 沒(méi)有 cookie 。
• 沒(méi)有開(kāi)放加載 web 頁(yè)面
• 沒(méi)有a標(biāo)簽鏈接，不可嵌套 iframe
• 沒(méi)有 window 變量，但微信提供了wx全局方法集
• 事件綁定和條件渲染類(lèi)似 Angular ，全部寫(xiě)在 WXML 中

1.1 主體

由 app.js 、 app.json 、 app.wxss 三個(gè)文件組成，放在根目錄

• app.js 根目錄的 app.js 很有用,因?yàn)樵谒鼉?nèi)部注冊(cè)的變量或方法，都是可以被所有頁(yè)面獲取到。可以監(jiān)聽(tīng)并處理小程序的生命周期、聲明全局變量。其余的 .js 文 件可以通過(guò) var app = getApp() 獲取其實(shí)例，調(diào)用其中定義的方法和變量，但不可以調(diào)用生命周期的方法
• app.json 是小程序的全局配置

pages 配置小程序的組成頁(yè)面，第一個(gè)代表小程序的初始頁(yè)面
window  設(shè)置小程序的狀態(tài)欄、標(biāo)題欄、導(dǎo)航條、窗口背景顏色
tabBar  配置小程序tab欄的樣式和對(duì)應(yīng)的頁(yè)面

• app.wxss 是小程序的公共樣式表，可以在其他 .wxss 文件中直接使用

app.json

"pages": [ //設(shè)置頁(yè)面的路徑
  "pages/index/index", //不需要寫(xiě)index.wxml,index.js,index,wxss,框架會(huì)自動(dòng)尋找并整合
  "pages/logs/logs"
],
"window": { //設(shè)置默認(rèn)窗口的表現(xiàn)形式
  "navigationBarBackgroundColor": "#ffffff", //頂部導(dǎo)航欄背景色
  "navigationBarTextStyle": "black", //頂部導(dǎo)航文字的顏色 black/white
  "navigationBarTitleText": "微信接口功能演示", //頂部導(dǎo)航的顯示文字
  "backgroundColor": "#eeeeee", //窗口的背景色
  "backgroundTextStyle": "light", //下拉背景字體、loading 圖的樣式，僅支持 dark/light
  "enablePullDownRefresh": "false"， //是否支持下拉刷新 ，不支持的話(huà)就直接不寫(xiě)！
  "disableScroll": true, //  設(shè)置true不能上下滾動(dòng)，true/false，注意！只能在 page.json 中有效，無(wú)法在 app.json 中設(shè)置該項(xiàng)。
},
"tabBar": { //底部tab或者頂部tab的表現(xiàn)，是個(gè)數(shù)組，最少配置2個(gè)，最多5個(gè)
  "list": [{ //設(shè)置tab的屬性，最少2個(gè)，最多5個(gè)
    "pagePath": "pages/index/index", //點(diǎn)擊底部 tab 跳轉(zhuǎn)的路徑
    "text": "首頁(yè)", //tab 按鈕上的文字
    "iconPath": "../img/a.png", //tab圖片的路徑
    "selectedIconPath": "../img/a.png" //tab 在當(dāng)前頁(yè)，也就是選中狀態(tài)的路徑
  }, {
    "pagePath": "pages/logs/logs",
    "text": "日志"
  }],
  "color": "red", //tab 的字體顏色
  "selectedColor": "#673ab7", //當(dāng)前頁(yè) tab 的顏色，也就是選中頁(yè)的
  "backgroundColor": "#2196f3", //tab 的背景色
  "borderStyle": "white", //邊框的顏色 black/white
  "position": "bottom" //tab處于窗口的位置 top/bottom
  },
"networkTimeout": { //默認(rèn)都是 60000 秒一分鐘
    "request": 10000, //請(qǐng)求網(wǎng)絡(luò)超時(shí)時(shí)間 10000 秒
    "downloadFile": 10000， //鏈接服務(wù)器超時(shí)時(shí)間 10000 秒
      "uploadFile": "10000", //上傳圖片 10000 秒
    "downloadFile": "10000" //下載圖片超時(shí)時(shí)間 10000 秒
  },
"debug": true //項(xiàng)目上線(xiàn)后，建議關(guān)閉此項(xiàng)，或者不寫(xiě)此項(xiàng)

1.2 pages

pages 文件夾里是小程序的各個(gè)頁(yè)面，每個(gè)界面一般都由 .wxml 、 .wxss 、 .js 、 .json四個(gè)文件組成，四個(gè)文件必須是相同的名字和路徑

• .js 是頁(yè)面的腳本代碼，通過(guò) Page() 函數(shù)注冊(cè)頁(yè)面。可以指定頁(yè)面的初始數(shù)據(jù)、生命周期、事件處理等
• .wxml 是頁(yè)面的布局文件，只能使用微信定義的組件
• .wxss 是樣式表，需要注意
  • 尺寸單位： rpx 可以根據(jù)屏幕的寬帶進(jìn)行自適應(yīng)
  • 樣式導(dǎo)入： @import 導(dǎo)入外聯(lián)樣式表，如： @import "test.wxss" ;
  • 定義在 app.wxss 中的全局樣式，作用于每個(gè)頁(yè)面。定義在 page 的 .wxss 文件只作用于對(duì)應(yīng)的頁(yè)面，會(huì)覆蓋 app.wxss 中相同的選擇器
• .json 是頁(yè)面的配置文件，只能設(shè)置 app.json 中的 window 配置內(nèi)容，會(huì)覆蓋 app.json 中 window 的相同配置項(xiàng)，即使不配置任何東西也需要寫(xiě) {} ,否則會(huì)報(bào)錯(cuò)

1.3 utils

utils 里面包含一些公共的代碼抽取的 js 文件，作為模塊方便使用。模塊通過(guò) module.exports 對(duì)外暴露接口

• 其他地方使用是 var utils = require('../../utils/util.js') 進(jìn)行引用

二、視圖層 WXML

2.1 數(shù)據(jù)綁定

傳統(tǒng)的視圖和數(shù)據(jù)綁定

那么微信小程序是通過(guò)什么方法來(lái)管理視圖和對(duì)象綁定的呢,狀態(tài)模式-單向數(shù)據(jù)流

數(shù)據(jù)流向是單向的，即視圖變化不會(huì)影響對(duì)象狀態(tài)

UI

.wxml 中的動(dòng)態(tài)數(shù)據(jù)都來(lái)自 Page 中的 data 。數(shù)據(jù)綁定使用數(shù)據(jù)綁定使用雙大括號(hào)將變量包起來(lái)，可以作用于內(nèi)容、組件屬性(需要在雙引號(hào)之內(nèi))、控制屬性(需要在雙引號(hào)之內(nèi))、關(guān)鍵字(需要在雙引號(hào)之內(nèi))

Page({
    data: {
        message: "Hello",
        id:0,
        status: true
    }
})

<view> {{message}} view>
<view id="item-{{id}}"> view>
<view wx:if="{{status}}"> view>
<view hidden="{{status}}"> checkbox>

還可以進(jìn)行簡(jiǎn)單的運(yùn)算在大括號(hào)里

<view hidden="{{status ? true : false}}"> Hidden view>
<view> {{a + b}} + c view> 
<view wx:if="{{num > 6}}"> view>
<view>{{"hello" + word}}view>

2.2 條件渲染

用 wx:if=”” 來(lái)判斷是否渲染代碼塊

<view wx:if="{{status}}"> isShow view>

還可以添加 else 塊

<view wx:if="{{num > 5}}"> A view>
<view wx:elif="{{num > 2}}"> B view>
<view wx:else> C view>

2.3 列表渲染

• 在組件上使用 wx:for 屬性綁定一個(gè)數(shù)組，就可以渲染組件了
• 默認(rèn)情況下數(shù)組的當(dāng)前下標(biāo)變量名為 index ,當(dāng)前項(xiàng)的變量名為 item

<view wx:for="{{array}}">
  {{index}}: {{item.message}}
view>

Page({
  data: {
    array: ["AA","BB","CC"]
  }
})

使用 wx:for-item 可以指定數(shù)組當(dāng)前元素的變量名，使用 wx:for-index 可以指定數(shù)組當(dāng)前下標(biāo)的變量名

<view wx:for="{{array}}" wx:for-index="num" wx:for-item="itemName">
  {{num}}: {{itemName}}
view>

2.4 模板template

• name 定義組件模版的名稱(chēng)，引用模版的時(shí)候使用 is 屬性指定模版的名字， is 可以進(jìn)行簡(jiǎn)單的三目運(yùn)算，需要傳入模版需要的 data 數(shù)據(jù)。
• 因?yàn)槟０鎿碛凶约旱淖饔糜颍灾荒苁褂?nbsp;data 傳入數(shù)據(jù)，而不接受雙花括號(hào)的寫(xiě)法

<template name="msgItem">
<view>
<text> {{index}}: {{msg}} text>
<text> Time: {{time}} text>
view>
template>


<template is="msgItem" data="{{...item}}"/>

2.5 公共模塊的引用

• WXML 提供 import 和 include 兩種文件引用方式。
• import 有作用域的概念，不能多重引用

<import src="a.wxml"/>


<template name="A">
 <text> A template text>
template>

include 就可以多重引用

<include src="header.wxml"/>
<view> body view>


<view> header view>
<include src="footer.wxml"/>

2.6 事件

• 名稱(chēng)以 bind 開(kāi)頭的事件不阻止冒泡，名稱(chēng)以 catch 開(kāi)頭的事件冒泡是阻止的。如 bindTap和 catchTab
• 在 WXM L 中，可以使用 dataset 定義 data 中的數(shù)據(jù)，會(huì)通過(guò)事件傳遞。它的事件以 data-開(kāi)頭，多個(gè)單詞以 - 鏈接，如 data-a-b

三、生命周期

3.1 App()應(yīng)用生命周期

onLaunch
onShow
onHide
onShow
onError

前臺(tái)、后臺(tái)定義： 當(dāng)用戶(hù)點(diǎn)擊左上角關(guān)閉，或者按了設(shè)備 Home 鍵離開(kāi)微信，小程序并沒(méi)有直接銷(xiāo)毀，而是進(jìn)入了后臺(tái)；當(dāng)再次進(jìn)入微信或再次打開(kāi)小程序，又會(huì)從后臺(tái)進(jìn)入前臺(tái)

//app.js
App({
  onLaunch: function() { 
      //小程序初始化(全局只觸發(fā)一次)
  },
  onShow: function() {
      //小程序顯示
  },
  onHide: function() {
      //小程序隱藏
  },
  onError: function(msg) {
      //小程序錯(cuò)誤
  },
})
//其他 開(kāi)發(fā)者可以添加任意的函數(shù)或數(shù)據(jù)到 Object 參數(shù)中，用 this 可以訪(fǎng)問(wèn)

3.2 Page頁(yè)面生命周期

每個(gè)頁(yè)面也有自己的生命周期

• 小程序注冊(cè)完成后，加載頁(yè)面，觸發(fā) onLoad 方法。
• 頁(yè)面載入后觸發(fā) onShow 方法，顯示頁(yè)面。
• 首次顯示頁(yè)面，會(huì)觸發(fā) onReady 方法，渲染頁(yè)面元素和樣式，一個(gè)頁(yè)面只會(huì)調(diào)用一次。
• 當(dāng)小程序后臺(tái)運(yùn)行或跳轉(zhuǎn)到其他頁(yè)面時(shí)，觸發(fā) onHide 方法。
• 當(dāng)小程序有后臺(tái)進(jìn)入到前臺(tái)運(yùn)行或重新進(jìn)入頁(yè)面時(shí)，觸發(fā) onShow 方法。
• 當(dāng)使用重定向方法 wx.redirectTo(OBJECT) 或關(guān)閉當(dāng)前頁(yè)返回上一頁(yè) wx.navigateBack() ，觸發(fā) onUnload

//index.js
Page({
  onLoad: function(options) {
    //頁(yè)面加載-----(一個(gè)頁(yè)面只會(huì)調(diào)用一次)
  },
  onReady: function() {
    //頁(yè)面渲染-----(一個(gè)頁(yè)面只會(huì)調(diào)用一次)
  },
  onShow: function() {
    //頁(yè)面顯示-----(每次打開(kāi)頁(yè)面都會(huì)調(diào)用一次)
  },
  onHide: function() {
    //頁(yè)面隱藏-----(當(dāng)navigateTo或底部tab切換時(shí)調(diào)用)
  },
  onUnload: function() {
    //頁(yè)面卸載-----(當(dāng)redirectTo或navigateBack的時(shí)候調(diào)用)
  },
})
//其他 開(kāi)發(fā)者可以添加任意的函數(shù)或數(shù)據(jù)到 object 參數(shù)中，在頁(yè)面的函數(shù)中用 this 可以訪(fǎng)問(wèn)

3.3 應(yīng)用生命周期影響頁(yè)面生命周期

• 小程序初始化完成后，頁(yè)面首次加載觸發(fā) onLoad ，只會(huì)觸發(fā)一次。
• 當(dāng)小程序進(jìn)入到后臺(tái)，先執(zhí)行頁(yè)面 onHide 方法再執(zhí)行應(yīng)用 onHide 方法。
• 當(dāng)小程序從后臺(tái)進(jìn)入到前臺(tái)，先執(zhí)行應(yīng)用 onShow 方法再執(zhí)行頁(yè)面 onShow 方法

四、小程序限制

4.1 程序限制

• 腳本內(nèi)不能使用 window 等對(duì)象
• zepto/jquery 會(huì)使用到 window 對(duì)象和 document 對(duì)象，所以無(wú)法使用。
• 樣式表不支持級(jí)聯(lián)選擇器
• 本地資源無(wú)法通過(guò) css 獲取 background-image 可以使用網(wǎng)絡(luò)圖片，或者 base64 ，或者使用標(biāo)簽
• 不支持 A 標(biāo)簽，無(wú)法打開(kāi)普通網(wǎng)頁(yè)

4.2 數(shù)量限制

• 底部或頂部可以添加 tab 按鈕區(qū)域 tabBar 是一個(gè)數(shù)組，只能配置最少2個(gè)、最多5個(gè) tab ， tab 按數(shù)組的順序排序。
• 一個(gè)應(yīng)用同時(shí)只能打開(kāi)5個(gè)頁(yè)面
• 小程序的 wx.request 請(qǐng)求最開(kāi)始最大并發(fā)數(shù)是5個(gè)，后來(lái)，估計(jì)隨著用小程序的越來(lái)越多，總之，就是增加到了10個(gè)

4.3 大小限制

• tabBar 上面的按鈕 iconPath 圖片路徑， icon 大小限制為 40kb
• tabBar 上面的按鈕 selectedIconPath 選中時(shí)的圖片路徑， icon 大小限制為 40kb
• setData 頁(yè)面?zhèn)鬟f數(shù)據(jù)單次設(shè)置的數(shù)據(jù)不能超過(guò) 1024kB
• setStorage 本地緩存最大為 10MB
• 小程序源碼打包后的大小限制為 1M

五、路由

• 微信路由接口有三個(gè)，分別是 wx.redirectTo 、 wx.navigateTo 和 wx.switchTab 
  wx.navigateTo 全局最多調(diào)用5次
• 如果某頁(yè)面設(shè)置為 tab 頁(yè)，則只支持 wx.switchTab ，不支持其他兩種路由方式訪(fǎng)問(wèn)

5.1 哪些情況會(huì)觸發(fā)頁(yè)面跳轉(zhuǎn)

• 小程序啟動(dòng)，初始化第一個(gè)頁(yè)面
• 打開(kāi)新頁(yè)面，調(diào)用 API wx.navigateTo 或使用  組件
• 頁(yè)面重定向，調(diào)用 API wx.redirectTo 或使用  組件
• 頁(yè)面返回，調(diào)用 API wx.navigateBack 或用戶(hù)按左上角返回按鈕
• tarbar 切換

5.2 如何跳轉(zhuǎn)頁(yè)面

• 使用 wx.navigateTo 接口跳轉(zhuǎn),原頁(yè)面保留

wx.navigateTo({
  //目的頁(yè)面地址
  url: 'pages/logs/index',
  success: function(res){},
  ...
})

• 使用 wx.redirectTo 接口跳轉(zhuǎn)，關(guān)閉原頁(yè)面,不能返回

wx.redirectTo({
  //目的頁(yè)面地址
  url: 'pages/logs/index',
  success: function(res){},
  ...
})

5.3 使用組件

"pages/logs/index" hover-class="navigator-hover">跳轉(zhuǎn)

當(dāng)該組件添加 redirect 屬性時(shí)，等同于 wx.redirectTo 接口；默認(rèn) redirect 屬性為 false，等同于 wx.navigateTo 接口

用戶(hù)點(diǎn)擊左上角返回按鈕，或調(diào)用 wx.navigateBack 接口返回上一頁(yè)

wx.navigateBack({
    delta: 1
})

delta 為1時(shí)表示返回上一頁(yè)，為2時(shí)表示上上一頁(yè)，以此類(lèi)推；如果dalta大于已打開(kāi)的頁(yè)面總數(shù)，則返回到首頁(yè)。返回后，元界面會(huì)銷(xiāo)毀

5.4 頁(yè)面跳轉(zhuǎn)傳值

url?key=value&key1=value1

傳遞的參數(shù)沒(méi)有被 URIEncode ,傳遞中文沒(méi)有亂碼

5.5 如何正確使用頁(yè)面跳轉(zhuǎn)

官方規(guī)定小程序最多只能有五個(gè)頁(yè)面同時(shí)存在，意思是在不關(guān)閉頁(yè)面的情況，最多新開(kāi)五個(gè)頁(yè)面，頁(yè)面深度為5

• 對(duì)于可逆操作，使用 wx.navigateTo ,比如從首頁(yè)跳轉(zhuǎn)到二級(jí)頁(yè)面，從二級(jí)頁(yè)面返回是不需要重新渲染首頁(yè)
• 對(duì)于不可逆操作，使用 wx.redirectTo ,比如用戶(hù)登錄成功后，關(guān)閉登錄頁(yè)面，不能返回到登錄界面。
• 對(duì)于一些介紹性等不常用頁(yè)面 wx.redirectTo 或 wx.navigatrBack
• 不要在首頁(yè)使用 wx.redirectTo ，這樣會(huì)導(dǎo)致應(yīng)用無(wú)法返回首頁(yè)

5.6 頁(yè)面棧

getCurrentPages()

使用wx.navigateTo每新開(kāi)一個(gè)頁(yè)面，頁(yè)面棧大小加1,直到頁(yè)面棧大小為5為止

使用wx.navigateTo重復(fù)打開(kāi)界面

假如使用wx.navigateTo從四級(jí)頁(yè)面跳轉(zhuǎn)到二級(jí)頁(yè)面，此時(shí)會(huì)在頁(yè)面棧頂添加一個(gè)與二級(jí)頁(yè)面初始狀態(tài)一樣的界面，但兩個(gè)頁(yè)面狀態(tài)是獨(dú)立的。頁(yè)面棧大小會(huì)加1，如果頁(yè)面棧大小為5，則wx.navigateTo無(wú)效

使用wx.redirectTo重定向

假如使用wx.redirectTo從四級(jí)頁(yè)面重定向到二級(jí)頁(yè)面，此時(shí)會(huì)將關(guān)閉四級(jí)頁(yè)面，并使用二級(jí)頁(yè)面替換四級(jí)頁(yè)面，但兩個(gè)頁(yè)面狀態(tài)是獨(dú)立的。此時(shí)的頁(yè)面棧大小不變，請(qǐng)注意和使用wx.navigateTo的區(qū)別

使用wx.navigateBack返回

總結(jié)

wx.navigateTo
wx.redirectTo
wx.navigateBack

六、數(shù)據(jù)通信

6.1 頁(yè)面之間的通信

app.globalData
wx.setStorageSync
url

// A頁(yè)面-傳遞數(shù)據(jù)

// 需要注意的是，wx.switchTab 中的 url 不能傳參數(shù)。
wx.navigateTo({
   url:'../pageD/pageD?name=raymond&gender=male'
})

// B頁(yè)面-接收數(shù)據(jù)//

//通過(guò)onLoad的option...

Page({
onLoad: function(option){
 console.log(option.name +'is'+ option.gender)// raymond is male
  this.setData({option: option })
}})

6.2 參數(shù)傳遞

6.2.1 小程序傳遞參數(shù)的方式

1、通過(guò)在 App.js 中設(shè)置全局變量

通常把不會(huì)更改的數(shù)據(jù)放在 app.js 的 Data 中，在各個(gè)頁(yè)面中都可以通過(guò) APP 實(shí)例獲取 Data 數(shù)據(jù)

var app = getApp();
var data = app.data;

2、通過(guò)拼接 URL 直接傳遞

wx.navigateTo({}) 中 URL 攜帶參數(shù)

wx.navigateTo({
  url: 'test?id=1'
});

在wxml中使用 navigator 跳轉(zhuǎn)url傳遞參數(shù)

代碼如下，將要傳遞到另一個(gè)頁(yè)面的字符串testId的值賦值到url中

class="test-item" url="../../pages/test/test?testId={{testData.testId}}">navigator>

在 js 頁(yè)面中 onLoad 方法中接收

Page({
  onLoad: function(options) {
      var testId = options.testId
      console.log(testId)
  }
})

navigator 跳轉(zhuǎn) url 傳遞數(shù)組

如果一個(gè)頁(yè)面要將一個(gè)數(shù)組，如相冊(cè)列表傳遞到另一個(gè)頁(yè)面

class="test-item" url="../../pages/test/test?albumList={{testData.albumList}}">navigator>

傳遞到j(luò)s后從 options 中得到的是個(gè)字符串，每個(gè)圖片的url通過(guò)’,’分隔，所以此時(shí)還需要對(duì)其進(jìn)行處理，重新組裝為數(shù)組

Page({
    data: {
         // 相冊(cè)列表數(shù)據(jù)
        albumList: [],
    },    
    onLoad: function (options) {
        var that = this;

        that.setData({
            albumList: options.albumList.split(",")
        });
    }
})

3、在wxml中綁定事件后，通過(guò) data-hi="參數(shù)" 的方式傳遞

這種方式一般是在wxml中綁定事件，同時(shí)設(shè)置需要傳遞的數(shù)據(jù)，如果需要傳遞多個(gè)，可以寫(xiě)多個(gè) data-[參數(shù)] 的方式進(jìn)行傳遞

<view bindtap="clickMe" data-testId={{testId}}">
    ...
view>

在js頁(yè)面中自定義方法clickMe中接收

Page({
    clickMe: function(event) {
        var testId = event.currentTarget.dataset.testid;
        wx.navigateTo({
            url: '../../pages/test/test'
        })
    }
})

wxml中配置data-albumlist傳遞數(shù)組

<view bindtap="clickMe" data-albumlist={{testData.albumList}}">
    
view>

在js頁(yè)面中自定義方法clickMe中接收

Page({
    clickMe: function(event) {
        var albumList = event.currentTarget.dataset.albumlist.split(",");
        wx.navigateTo({
            url: '../../pages/test/test'
        })
    }
})

4、通過(guò)數(shù)據(jù)緩存存儲(chǔ)再獲取

wx.setStorageSync(KEY,DATA) 存儲(chǔ)數(shù)據(jù)

try {
  wx.setStorageSync('key', 'value')
} catch (e) {    
}

wx.getStorageSync(KEY) 獲取數(shù)據(jù)

try {
  var value = wx.getStorageSync('key')
  if (value) {
    // Do something with return value
  }
} catch (e) {
   // Do something when catch error
}
或
wx.getStorage({
  key: 'key',
  success: function(res) {
     console.log(res.data)
  }
})

七、疑問(wèn)匯總

為什么腳本內(nèi)不能使用window等對(duì)象

• 頁(yè)面的腳本邏輯是在 JsCore 中運(yùn)行，JsCore是一個(gè)沒(méi)有窗口對(duì)象的環(huán)境，所以不能在腳本中使用 window ，也無(wú)法在腳本中操作組件

為什么 zepto/jquery 無(wú)法使用

• zepto/jquery 會(huì)使用到 window 對(duì)象和 document 對(duì)象，所以無(wú)法使用

wx.navigateTo無(wú)法打開(kāi)頁(yè)面

• 一個(gè)應(yīng)用同時(shí)只能打開(kāi)5個(gè)頁(yè)面，當(dāng)已經(jīng)打開(kāi)了5個(gè)頁(yè)面之后， wx.navigateTo 不能正常打開(kāi)新頁(yè)面。請(qǐng)避免多層級(jí)的交互方式，或者使用 wx.redirectTo

樣式表不支持級(jí)聯(lián)選擇器

• WXSS 支持以 . 開(kāi)始的類(lèi)選擇器

本地資源無(wú)法通過(guò) css 獲取

• background-image ：可以使用網(wǎng)絡(luò)圖片，或者 base64 ，或者使用  標(biāo)簽

如何修改窗口的背景色

• 使用 page 標(biāo)簽選擇器，可以修改頂層節(jié)點(diǎn)的樣式

page { 
  display: block; 
  min-height: 100%; 
  background-color: red;
}

為什么上傳不成功

• 為了提升體驗(yàn)流暢度，編譯后的代碼包大小需小于 1MB ，大于 1MB 的代碼包將上傳失敗

HTTPS 請(qǐng)求不成功

• tls 僅支持 1.2 及以上版本

微信小程序支持fetch或者promise嗎?

• promise 工具目前不支持， fetch 客戶(hù)端不支持 工具下個(gè)版本保持統(tǒng)一

wx.request的POST方法的參數(shù)傳輸服務(wù)器接收不到的bug

• wx.request post 的 content-type 默認(rèn)為 ‘application/json '
• 如果服務(wù)器沒(méi)有用到 json 解釋的話(huà)，可以把 content-type 設(shè)置回 urlencoded

wx.request({
....
method: "POST",
header: {
"content-type": "application/x-www-form-urlencoded"
},
...
})

wx.uploadFile在手機(jī)上返回http碼403

• 安卓的微信升級(jí)到6.5.2及其以上版本

小程序SVG支持嗎?

• image 的src放遠(yuǎn)程svg可以， background-image 里也可以

ipad不能使用小程序？

• 暫時(shí)不支持ipad打開(kāi)小程序

請(qǐng)問(wèn)小程序頁(yè)內(nèi)支持長(zhǎng)按保存圖片或分享圖片嗎？

• 目前沒(méi)有這個(gè)功能

微信小程序不支持cookie

• 使用 Reids 存儲(chǔ) session

有些手機(jī)不支持Object.assign方法，如果使用了該方法會(huì)出現(xiàn)莫名其妙的報(bào)錯(cuò)（并不會(huì)提示Object.assign is not function，而是導(dǎo)致調(diào)用了Object.assign方法的方法不能被調(diào)用）！

直接寫(xiě)一個(gè)合并對(duì)象的方法

function assignObject(o, n) {
    for (var p in n) {
        if (n.hasOwnProperty(p) && (!o.hasOwnProperty(p)))
            o[p] = n[p];
    }
}