微信小程序開發學習(一)
阿新 • • 發佈:2019-03-23
接受 ext 配置 微信小程序開發 onf error n) chan thead
以on開頭的API用來監聽某個事件是否觸發,如:
以Sync結尾的API都是同步API,如
一、各種JSON配置
1、小程序配置app.json
為小程序全局配置,包括所有頁面路徑、界面表現、網絡超時時間、底部tab等,類比APP開發中manifest配置。
2、工具配置project.config.json
一些個性化配置,暫時沒遇到需要用到的地方。
3、頁面配置page.json
獨立定義每個頁面一些屬性,如頂部顏色、是否允許下拉刷新。不過色調感覺還是統一定義比較好,適合多個頁面情況,一般來說小程序主要是結合tab實現多頁面。
二、WXML
1、標簽名
類比HTML,不過標簽名是view、button、text 等,更貼近APP開發控件名。
2、一些屬性與表達式
網頁開發時提倡把渲染與邏輯分離,即不讓JS直接操控DOM,只需管理狀態,小程序也是同樣的思路。如:
WXML:
<text>{{msg}}</text>
JS:
this.setData({msg: ‘Hello World‘})
以上通過{{ }}的語法把一個變量綁定到界面上,即數據綁定。除此之外,還需要 if/else, for等控制能力,這些控制能力都用 wx: 開頭的屬性來表達。
三、API
1、事件監聽API
以on開頭的API用來監聽某個事件是否觸發,如:wx.onSocketOpen
,wx.onCompassChange
等。
這類API接受一個回調函數作為參數,當事件觸發時會調用這個回調函數,並將相關數據以參數形式傳入。如:
wx.onCompassChange(function (res) { console.log(res.direction) })
2、同步API
以Sync結尾的API都是同步API,如wx.setStorageSync
,wx.getSystemInfoSync
等。同步 API 的執行結果可以通過函數返回值直接獲取,如果執行出錯會拋出異常。如:
try {
wx.setStorageSync('key', 'value')
} catch (e) {
console.error(e)
}
3、異步API
這類 API 接口通常都接受一個 Object 類型的參數,這個參數都支持按需指定以下字段來接收接口調用結果:
Object參數說明
參數名 | 說明 |
---|---|
success | 接口調用成功的回調函數 |
fail | 接口調用失敗的回調函數 |
complete | 接口調用結束的回調函數(調用成功、失敗都會執行) |
回調函數的參數
屬性 | 類型 | 說明 |
---|---|---|
errMsg | string | 錯誤信息,如果調用成功返回 ${apiName}:ok |
errCode | number | 錯誤碼,僅部分 API 支持,具體含義請參考對應 API 文檔,成功時為 0 |
4、一些示例
獲取用戶地理位置
wx.getLocation({
type: 'wgs84',
success: (res) => {
const latitude = res.latitude // 緯度
const longitude = res.longitude // 經度
}
})
微信掃一掃
wx.scanCode({
success: (res) => {
console.log(res)
}
})
多數API回調都為異步,異步API的執行結果需要通過Object類型的參數中傳入的對應回調函數獲取。部分異步API也會有返回值,可以用來實現更豐富的功能。
微信小程序開發學習(一)