原創(chuàng)聲明:本文為作者原創(chuàng)，未經(jīng)允許不得轉(zhuǎn)載，經(jīng)授權(quán)轉(zhuǎn)載需注明作者和出處
我們先了解小程序發(fā)起網(wǎng)絡(luò)請求的官方說明
wx.request(OBJECT)
OBJECT參數(shù)說明：
| 參數(shù)名 | 類型 | 必填 | 說明 |
|---|---|---|---|
| url | String | 是 | 開發(fā)者服務(wù)器接口地址 |
| data | Object,String | 否 | 請求的參數(shù) |
| header | Object | 否 | 設(shè)置請求的 header , header 中不能設(shè)置 Referer |
| method | String | 否 | 默認為 GET，有效值：OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT |
| success | Function | 否 | 收到開發(fā)者服務(wù)成功返回的回調(diào)函數(shù)，res = {data: ‘開發(fā)者服務(wù)器返回的內(nèi)容’} |
| fail | Function | 否 | 接口調(diào)用失敗的回調(diào)函數(shù) |
| complete | Function | 否 | 接口調(diào)用結(jié)束的回調(diào)函數(shù)（調(diào)用成功、失敗都會執(zhí)行） |
我們從一個登陸頁面的請求說起：
附上頁面代碼
<view class="inputView" style="margin-top: 40% ">
<input class="input" type="number" placeholder="請輸入賬號" placeholder-style="color: red" bindinput="listenerPhoneInput" />
</view>
<view class="inputView">
<input class="input" password="true" placeholder="請輸入密碼" placeholder-style="color: red" bindinput="listenerPasswordInput"/>
</view>
<button style="margin-left: 15rpx; margin-right: 15rpx; margin-top: 50rpx; border-radius: 40rpx" type="primary" bindtap="listenerLogin">登錄</button>
登錄的點擊按鈕事件listenerLogin點擊即post倆個input框值到后臺
我們使用咱們小程序平臺的api作為例子
listenerLogin: function() {
//打印收入賬號和密碼
console.log('手機號為: ', this.data.phone);
console.log('密碼為: ', this.data.password);
wx.request({
url: 'https://api.wxappclub.com/put',
data: {
appkey: 'youappkey' ,
key: this.data.phone,
value:this.data.password
},
header: {
'Content-Type': 'application/json'
},
success: function(res) {
console.log(res.data)
wx.navigateTo({
url: '../result/result'
})
},
fail: function(){
console.log('失敗！')
}
});
}
走一趟流程：
這就是很基礎(chǔ)的request使用案例
附上官方API文檔地址：https://mp.weixin.qq.com/debug/wxadoc/dev/api/network-request.html?t=20161122
小黃象API文檔地址：http://m.guanlustone.com/apicenter/?api=put
共9條評論
Ctrl+Enter
