微信小程式如何呼叫API實現資料請求-wx.request()
前言
微信小程式不存在ajax
,那麼它是如何實現資料請求功能的呢?微在信中提供了API
的呼叫wx.request(OBJECT)
,這個是很不錯的。下面就講一下如何請求資料,簡單到不行。
wx.request
看文件時,提供了示例模板如下:
wx.request({
url: 'test.php', //僅為示例,並非真實的介面地址
data: {
x: '' ,
y: ''
},
header: {
'content-type': 'application/json' // 預設值
},
success: function(res) {
console.log(res.data)
}
})
如何調取資料這是個難題,但是要模擬呼叫是有可能的。因為有個網址:https://easy-mock.com/ ,提供了模擬資料的請求。那麼我們先來模擬一下資料吧,到時,複製連結給模板中的網址即可。
如圖登入官網,登入,接著點選箭頭,進入下一頁面。
點選建立介面。
更新資料,建立屬於自己的資料即可。
一可預覽效果,連結複製到url
模板中。
接著我們開啟微信小程式的開發工具,在介面中新增按鈕請求即可。
<button type='primary' bindtap='send'>請求資料</button>
在接著js
檔案中新增事件。
//send
send: function(){
wx.request({
url: '複製的連結', //僅為示例,並非真實的介面地址
data: {
x: '',
y: ''
},
header: {
'content-type': 'application/json' // 預設值
},
success: function (res) {
console.log(res.data)
}
})
}
點選按鈕如果出現下面的錯誤,那是因為要到詳情按鈕中,給個地方打個勾即可。
找到下方打鉤即可。
點選按鈕,即可檢視,請求資料效果出現了。
結語
- 你完成了嗎?是不是,很容易呢?是不是很簡單呢?
相關文章
- 微信小程式 wx.request統一呼叫微信小程式
- 微信小程式 request請求封裝微信小程式封裝
- 微信小程式 wx.request 的封裝微信小程式封裝
- 微信小程式開發系列六:微信框架API的呼叫微信小程式框架API
- 微信小程式request請求的封裝微信小程式封裝
- 基於小程式請求介面 wx.request 封裝的類 axios 請求封裝iOS
- 微信小程式wx.request的簡單封裝微信小程式封裝
- 如何在原生微信小程式中實現資料雙向繫結微信小程式
- 服務端呼叫微信小程式OCR識別介面實現服務端微信小程式
- 小程式封裝wx.request請求並建立介面管理檔案封裝
- 微信小程式解除 10 個請求併發限制了?!微信小程式
- 微信小程式如何實現自動退款功能?微信小程式
- 當微信小程式遇上TensorFlow:小程式實現微信小程式
- 微信小程式 遮罩功能實現微信小程式遮罩
- 微信公眾號回覆小程式卡片如何實現?
- .NET CORE 6 API與原生微信小程式資料互通教程API微信小程式
- 微信小程式,實現 watch 屬性,監聽資料變化微信小程式
- 微信小程式實現軌跡回放,微信原生小程式,基於uniapp的小程式?微信小程式APP
- 關於微信小程式中如何實現資料視覺化-echarts動態渲染微信小程式視覺化Echarts
- 解析Fetch實現請求資料
- 微信小程式 獲取微信暱稱頭像 獲取openid 封裝請求post微信小程式封裝
- 微信小程式資料處理微信小程式
- 微信小程式—— 獲取資料微信小程式
- 微信小程式實現換膚功能微信小程式
- JS實現監控微信小程式JS微信小程式
- 小程式實現微信 【我的】介面
- 微信小程式(JAVAScript)實現餅圖微信小程式JavaScript
- 微信小程式函式呼叫監控微信小程式函式
- 前端呼叫微信小程式的支付流程前端微信小程式
- 前端快取API請求資料前端快取API
- 如何在 PyQt 中實現非同步資料庫請求QT非同步資料庫
- 微信小程式教程04:API(完結)微信小程式API
- Laravel 下微信小程式支付 API 配置Laravel微信小程式API
- 微信小程式實現WebSocket心跳重連微信小程式Web
- 微信小程式實現星星評分效果微信小程式
- 微信小程式實現釋出作業微信小程式
- 微信,支付寶小程式實現原理概述
- 如何在微信小程式中實現音視訊通話微信小程式